`
lysvanilla
  • 浏览: 80835 次
  • 性别: Icon_minigender_1
  • 来自: 湖南
社区版块
存档分类
最新评论

JavaScript的attachEvent传递的参数解决方案

阅读更多

文章背景说明:本人在开发时遇到的问题,在Iteye问答里提问,本文是在朋友们帮忙的回答中总结的。谢谢他们。

http://www.iteye.com/problems/88349

 

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">  
<html>  
<head>    
<title>About</title>  
<meta http-equiv=Content-Type content="text/html; charset=gb2312">  
</head>  
<body >  
<table width="100%">  
<tr><a href="#" onClick="alert('123');" >123明细信息</a></tr>  
<tr><a href="#" onClick="alert('456');" >456明细信息</a></tr>  
<tr><a href="#" onClick="alert('789');" >789明细信息</a></tr>  
<table>  
</body>  
<script language="javascript">  
function initHrefColor(objs){  
    var objs=document.getElementsByTagName("a");  
    outer:for(var i=0;i<objs.length;i++){  
        (function (e) {  
            e.attachEvent("onclick", function () { changeHrefStytle(e); });  
        })(objs[i]);  
   
    }}  
 
function changeHrefStytle(obj){
    obj.style.color='green';
   // if(!obj.innerText.contains('√')){
	obj.innerHTML = '√ ' + obj.innerText;
   // }
}  

initHrefColor(); 
</script>  
</html>  

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">  
<html>  
<head>  
  
<title>About</title>  
<meta http-equiv=Content-Type content="text/html; charset=utf8">  
</head>  
<body >  
<table width="100%" border="1">  
<tr><td><a href="#" >123明细信息</a></td></tr>  
<tr><td><a href="#" >456明细信息</a></td></tr>  
<tr><td><a href="#" >789明细信息</a></td></tr>  
<tr><td><text>ss</text></td></tr>  
<table>  
</body>  
<script language="javascript">  
  
function initHrefColor(){  
    var objs=document.getElementsByTagName("a");  
    var obj=null;  
    outer:for(var i=0;i<objs.length;i++){  
        obj=objs[i];  
        //非Mozilla系列  
        if(obj.attachEvent) {  
            obj.attachEvent("onclick",aaa);    
        } else {  
            obj.addEventListener("click",aaa);    
        }  
    }}  
  
  
function aaa(event){  
	var src = event.srcElement;
	if(!src) {  
		src = event.target;  
	} 
	src.style.color='green';
	//if(!src.innerText.contains('√')){
		src.innerHTML = '√ ' + src.innerText;
	//}
}  
  
initHrefColor();  
</script>  
  
</html>  

 

 

在js编写规范里,提到将js写到head里是最好的。
但是你这里var objs=document.getElementsByTagName("a"); 
如果写在head里肯定拿不到,所以要加上window.onload去执行。
 

网友提供的几个js学习网站(或者是文章链接):

 

http://bonsaiden.github.com/JavaScript-Garden/zh/

 

http://www.cnblogs.com/terryglp/articles/1776695.html

 

http://codex.wordpress.org.cn/HTML%E5%85%B3%E4%BA%8EEvent%E5%AF%B9%E8%B1%A1

 

分享到:
评论

相关推荐

    Javascript attachEvent传递参数的办法

    针对这种情况,解决方案是利用闭包的特性,创建一个包装函数来传递参数。这样,每次调用时都创建了一个新的闭包,参数得以正确传递。例如: ```javascript var newopen = function(id, level) { return function()...

    关于javaScript注册click大事传递参数的不胜利问题_.docx

    在提供的解决方案中,定义了一个名为`bindFunction`的辅助函数,它的作用是创建一个新的函数,这个新函数会记住原始函数(`func`)以及需要传递的参数(`args`),并在适当的时候调用`func`。`bindFunction`通过`...

    javascript兼容性解决方法大全

    首先,`window.event`对象是IE特有的,它包含了当前事件的相关信息,而在FF中,我们需要通过函数参数传递`event`对象,如`onmousemove=doMouseMove(event)`。为了解决这个问题,我们可以编写一个兼容的函数处理事件...

    window.open()实现post传递参数

    一种常见的解决方案是创建一个动态的表单,将数据放入隐藏的输入字段,然后模拟表单提交来实现POST请求。具体步骤如下: 1. 创建一个新的`&lt;form&gt;`元素,设置其`method`属性为`"post"`,`action`属性为需要POST的...

    智能社JavaScript系列视频资料

    - JSONP和CORS跨域请求解决方案。 5. **闭包** - 闭包是JavaScript中的高级概念,它可以访问外部作用域的变量,同时保持内部作用域的私有性。 - 闭包在函数工厂、模块模式、异步编程等场景中的应用。 6. **原型...

    self.attachevent is not a function的解决方法

    但是要注意,`addEventListener`有第三个参数用于指定事件处理函数的执行顺序(默认为false,即事件冒泡阶段),而`attachEvent`没有这个参数,所以通常在使用`attachEvent`时不需要传递额外的参数。 尽管`onclick`...

    JavaScript

    2. Angular:Google维护的一个全面的前端框架,提供了完整的解决方案。 3. Vue.js:轻量级的MVVM框架,易于学习,上手快速,受到开发者喜爱。 JavaScript持续发展: 随着Web技术的进步,JavaScript也在不断进化,...

    Professional JavaScript For Web Developers

    - **函数**:JavaScript中的函数是第一类公民,可以作为参数传递,也可以作为返回值。 - **作用域与闭包**:了解函数作用域、块级作用域以及闭包的概念,有助于避免变量污染和提升代码复用。 2. **JavaScript语法...

    javaScript

    Node.js的NPM(Node Package Manager)拥有庞大的第三方库生态,为开发者提供了丰富的工具和解决方案。 JavaScript还支持异步编程模型,如Promise和async/await,它们解决了回调地狱的问题,使得异步代码更加线性和...

    js循环动态绑定带参数函数遇到的问题及解决方案[转]

    本文将详细介绍在JavaScript中循环动态绑定带参数函数时可能遇到的问题,并提供解决方案。 首先,我们来看看不带参数的事件绑定方法,使用attachEvent方法,如下所示: ```javascript document.getElementById(...

    Javascript教程--从入门到精通[完整版]

    模块化是现代JavaScript开发的标准,CommonJS(Node.js中使用)和ES6的import/export为模块提供了解决方案。随着Webpack和Rollup等打包工具的流行,模块化已经成为项目组织的重要部分。 最后,JavaScript引擎的优化...

    javascript事件处理模型实例说明

    本文详细介绍了JavaScript事件处理模型,重点讲述了Internet Explorer(IE)和Mozilla Firefox(火狐)这两款主流浏览器在添加和删除事件监听器方面的差异,以及提供了一个通用的解决方案,从而允许开发者能够编写...

    JavaScript的常用t资料

    常见的JavaScript库和框架如jQuery简化DOM操作,React和Vue.js用于构建单页应用,Angular提供全面的前端解决方案。这些工具进一步提升了JavaScript开发的效率和应用的性能。 综上所述,这个压缩包中的JavaScript...

    css2和javascript学习教程

    7. 多列布局:CSS2提供了多列布局的支持,尽管CSS3中有了更好的解决方案,但在一些老项目中仍会用到。 JavaScript,另一方面,是Web开发中的脚本语言,负责处理用户的交互和动态内容。JavaScript的关键知识点涵盖:...

    JavaScript兼容浏览器FFIE技巧[定义].pdf

    Firefox则需要通过函数参数传递event对象,例如`onmousemove=doMouseMove(event)`。 - 示例:`var event = event || window.event;` 2. **鼠标当前坐标**: - **鼠标位置(不考虑滚动条)**:IE使用event.x和...

    史上最全javascript+css中问帮助手册

    这些手册将为初学者提供详尽的指导,并帮助经验丰富的开发者查找特定的解决方案。JavaScript和CSS的学习永无止境,随着技术的发展,新的API和标准不断出现,持续学习和实践是提升技能的关键。这份手册是宝贵的参考...

Global site tag (gtag.js) - Google Analytics