就出问题了,多个事件则可以这样写

时间:2020-03-14 19:17来源:澳门美高梅游戏
jQuery绑定事件大家应该很熟悉了。jquery在1.7版本后,建议大家用on方法代替之前的bind、live、delegate方法。这样一个需求,如果用live()方法实现的话非常简单,容易理解。 本文章来给各位

jQuery绑定事件大家应该很熟悉了。jquery在1.7版本后,建议大家用on方法代替之前的bind、live、delegate方法。这样一个需求,如果用live()方法实现的话 非常简单,容易理解。

本文章来给各位同学介绍关于jquery on()方法绑定多个选择器,多个事件,希望些方法对各位会有所帮助。

某天晚上写代码的时候,突然出了bug,想了很久都不知道问题出在哪里(其实是很简单的问题,但由于我还是个菜鸟,所以不知道)。几经周折,这中间的过程就不提了,终于让我在快崩溃的时候,发现了原因。原来是因为同一jquery元素可以重复绑定,当使用了嵌套绑定的时候,就容易出错。如代码:

$('navli,#sb-navli,#helpli').live('click',function(){

on(events,[selector],[data],fn)

复制代码 代码如下:

其实查看live源码就知道,live实际是委托doucment进行事件委派的。按照这个思路,可以将on方法绑定到document即可。

•events:一个或多个用空格分隔的事件类型和可选的命名空间,如"click"或"keydown.myPlugin" 。
•selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择器为null或省略,当它到达选定的元素,事件总是触发。
•data:当一个事件被触发时要传递event.data给事件处理函数。
•fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写,返回false。

$('.test').bind('click',function(){
     $('.last').bind('click',function(){
          alert('nihao');
     });
});

$.on('click','#header.fixed-feedback-bn,#sb-sec.feedback-bn',function(){

这样一个需求,如果用live()方法实现的话 非常简单,容易理解。

<button class="test">上一级绑定</button>
<button class="last">下一级绑定</button>

还有一种情况,on()方法绑定多个事件,可以这样写:

 代码如下

当我点击第一个button时,再点击第二个button,是没有问题的。可如果在页面刷新之前,点击了多次(n次)第一个button的话,此时再点击第二个button,就出问题了,就会弹出(n个)alert对话框。

$("table.planning_grid").on({

复制代码

解决办法:在会重复绑定的元素上执行解绑,即unbind(),如:

mouseenter:function(){

$('nav li, #sb-nav li, #help li').live('click', function () {
    // code...
});

复制代码 代码如下:

//Handlemouseenter...

jquery在1.7版本后,建议大家用on方法代替之前的bind、live、delegate方法。
那上面一句如果用on的话,怎么写呢?

$('.test').bind('click',function(){
     $('.last').unbind('click').bind('click',function(){
          alert('nihao');
     });
});

mouseleave:function(){

其实查看live源码就知道,live实际是委托doucment进行事件委派的。

 
这样,不管点击多少次第一个button,再点击第二个时,只会弹出一个alert对话框。

编辑:澳门美高梅游戏 本文来源:就出问题了,多个事件则可以这样写

关键词: