1

我通过 jQuery load() 加载内容,但每次加载给定页面时,页面上的点击都会被触发多次。为什么??

在这里找个小提琴:http: //jsfiddle.net/ZUZ3L/ph3tH/2/

4

4 回答 4

3

只需将您的点击处理程序放在以下位置load

$(document).ready(function() {
    function loadContent() {
        $(".ajaxContainer").load("http://fiddle.jshell.net/ #actions", function() {
            alert("Done");                
        });
    }

    $(".load").click(loadContent);
    loadContent();
});​

更新小提琴

于 2012-06-17T17:43:54.010 回答
2

每次加载内容时,都会执行以下行:

$(".load").click(loadContent);

它将一个新的事件处理程序添加到事件处理程序列表中,以便在.load单击时执行。你执行你的函数三次,现在你有三个相同的处理程序,每次点击都会触发。

于 2012-06-17T17:45:52.543 回答
1

因为您要调用该函数 2 次,请尝试以下操作:

$(document).ready(function() {
    function loadContent() {
        $(".ajaxContainer").load("http://fiddle.jshell.net/ #actions", function() {
            alert("Done");
        });
    }
    loadContent();
    $(".load").click(loadContent);

});

http://jsfiddle.net/ph3tH/4/

于 2012-06-17T17:43:44.833 回答
1

这是因为您要多次添加点击事件。

每次您的代码运行时,都会重新定义 click 函数。当一次点击被重新定义时,它不会替换之前的点击,而是会被添加到堆栈中以在每次“点击”事件发生时执行。这适用于 jQuery 中的所有事件。

当您通过 AJAX 加载时,文档中的变量和事件仍然存在。这意味着您只是在每次运行 ajax 调用时执行的函数调用层之上添加层

于 2012-06-17T17:43:55.367 回答