jQuery 事件中为 dom 元素动态绑定事件的方式:
绑定事件到元素上
$(selector).bind(‘eventName‘, function(){});
一次绑定多个事件时,事件名用单个空格隔开
$(selector).bind(‘click dbclick mouseMove‘, function(){});
想函数传入数据
$(selector).bind(‘eventName‘, {"name" : "shavol"}, function(e){
alert(e.data.name);
});
自 jQuery 版本 1.7 起,on() 方法是向被选元素添加事件处理程序的首选方法。
自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来很多便利,我们推荐使用该方法,它简化了 jQuery 代码库。
注意:使用 on() 方法添加的事件处理程序适用于当前及未来的元素(比如由脚本创建的新元素)。
提示:如需移除事件处理程序,请使用 off() 方法。
提示:如需添加只运行一次的事件然后移除,请使用 one() 方法。
用法与 bind 函数一样,除此以外,方法还可以绑定动态元素,即使用代码添加的元素事件
$(selector).live(‘eventName‘, [data], function(){});
只执行一次该事件
$(selector).one(‘eventName‘, [data], function(){});
括号内不写表示移除 selector 所绑定的所有事件
$(selector).unbind();
$(selector).delegate(‘element‘, ‘eventName‘, function(){
//function body;
});
手动触发事件
$(selector).trigger(‘eventName‘);
示例如下:
$("div").bind(‘change-color‘, function(){
$(this).css("color","red");
});
$("div").trigger("change-color");
在页面加载时触发 自定义的 change-color 事件
在 jQuery 1.8. 版本以前可使用 toggle() 函数绑定多个操作
$(selector).toggle(function(){
}, function(){
}, function(){
},
...);