1

我在我的页面中使用此代码。当我单击带有 .process_record 类的按钮时,它会给我一个警报,但如果我再次单击同一个按钮,它会一次给我 2 个警报。我不知道它为什么会这样。

$(".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");
    })
4

1 回答 1

0

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

在上面的小提琴中,这对我来说很有效。html设置为:

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

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

代码解决方案是让您的事件在单击时解除绑定并重新绑定,以确保每个事件只有一个处理程序:

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-26T19:44:57.457 回答