jQuery .on多次触发

我在代码页中使用了此代码。当我点击与.process_record类的按钮，它给了我一个单一的警报，但如果我再次点击同一个按钮，它一次给我2警报。我不知道为什么它的行为如此。jQuery .on多次触发

$(".body .content").on("click", ".process_record", function(e){ 

     alert("clicked"); 
     var url = $(this).attr("data-url"); 
     $.post(url, function(data){ 
      $(".body .content").html(data); 
     },"html"); 
    })

来源

2013-07-26 TPSstar

什么被附加到你的'$ .post'中？可能造成这种情况。 – tymeJV

每次点击它时，最有可能再次绑定它，因此每次连续点击都会导致每次点击触发一次额外的点击事件。 –

这似乎是因为通过$ .post加载的内容也有一个具有相同类的按钮。我想通过该按钮执行相同的操作，这就是为什么使用.on方法。 – TPSstar

http://jsfiddle.net/MaxPRafferty/z9VFA/

这正常工作对我来说在上面的小提琴。该HTML设置为：

<div class="body"> 
    <div class="content"> 
     <input type="button" class="process_record" /> 
    </div> 
</div>

我的猜测是你设置处理程序多次，也许在另一个点击事件。从您的评论中，您可能正在从您从其他页面注入的脚本标记再次执行绑定，当您加载ajax时。您可能通过将脚本标记移动到其他页面上的外部文件来解决此问题，然后在注入时确保只加载body标记，而不是头部或脚本。

代码解决方案是让您的活动解除绑定并重新绑定自己的点击，以确保只有一个处理器上的每个：

http://jsfiddle.net/MaxPRafferty/B5UPB/

var clickAction = function(){ 
    alert("clicked"); 
    $(".body .content").unbind("click"); 
    setClick($(".body .content"),clickAction); 
} 

var setClick = function(target,action){ 
    target.on("click", ".process_record",action) 
} 

setClick($(".body .content"),clickAction);

记住，这都将解除绑定$(".body .content")的事件，所以如果你只想卸载命名事件，请将取消绑定行更改为$(".body .content").unbind("click",clickAction);

来源

2013-07-26 19:44:57 MaxPRafferty

jQuery .on多次触发

回答

相关问题