`
funzhang2010
  • 浏览: 14171 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

【学习笔记】JavaScript动态的为元素添加带参数和不带参数的事件

阅读更多

目前的的页面布局都是基于XHTML,通过DIV+CSS布局,实现DHTML的样式。所以这个JavaScript动态的为元素添加事件因此而普遍了。下面我说说怎样通过javascript为元素动态的添加事件.
Javascript为元素动态的添加事件包括两种情况:
不带参数的事件和带参数的事件
一、不带参数的事件:
两种方式:直接给对象添加事件,节点添加事件
例如给一个idtab1的添加onclick事件
第一种情况:
var t = document.getElementById("NewTitle");
t.onclick = function showmsg(){
    alert('Hello!World');
}
第二种情况 这种情况更加动态,更为实用,而且还能添加多个函数(添加的事件的顺序即执行顺序),呵呵
   var tb = document.getElementById("NewTitle");
    if(window.addEventListener){ // Mozilla, Netscape, Firefox
        td_value.addEventListener('click', alert('cc'), false);
        td_value.addEventListener('click', alert('cc'), false);
    } else { // IE
        td_value.attachEvent('onclick',  function(){alert('changchang');});
        td_value.attachEvent('onclick',  function(){alert('changchang');});
    }
二、带参数的事件
这里的functionName就是事件处理函数,如果是带参数的那该怎么办,
有人说是这样:
element.onclick=function(sb){
        alert(sb);
    }
是不是上面的那种写法呢?答案是不正确的

解决方法一:定义一个不带参数的函数,并在其中调用带参数的函数:

function functionName(){

  anotherFunctionName(param1, param2,...);

}

element.onclick=functionName;//函数名称,不能带有参数
解决方法二:匿名函数:
    element.onclick=function() {
        functionName(param1, param2,...);

    }
 
这样就巧妙的通过匿名方法实现了!

付出最大努力,追求最高成就。

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics