DOM在加载函数后没有响应jquery evers

我有一个简单的页面来动态加载内容。我使用jQuery加载函数将内容附加到div。加载函数从另一个文件加载内容。我遇到的问题是，内容加载后，我建立的jQuery功能没有响应点击事件。DOM在加载函数后没有响应jquery evers

为了证明它的工作原理，我包含了内容，并且在DOM加载之后它完美地工作。需要帮助。

2012-02-09 Alex Force

代码会很有用 – twilson 2012-02-09 14:55:55

当你做这样的事情：

$("selector").click(function() { ... });

......只有那些在DOM已经将选择相匹配，并有自己的单击事件挂钩的元素;如果您以后添加的元素会有匹配选择器，它们将不会自动挂钩。

您可以使用事件代表团看似勾起来使用自动delegate或（使用jQuery的新版本）的on变体之一：

$("container_for_elements").delegate("selector", "click", function() { ... })); 
$("container_for_elements").on("click", "selector", function() { ... }));

（注意参数的顺序是略有不同两项）。

随着事件的代表团，到底发生了什么是jQuery的的容器在钩子上click，当点击冒泡的容器，它会检查事件发生，看看是否有T的路径他中间的元素与选择器匹配。如果是这样，它会像处理该元素一样触发处理程序，即使它实际上挂在了容器上。

具体的例子：

<div id="container"> 
    <span>One</span> 
    <span>Two</span> 
    <span>Three</span> 
</div>

如果我们这样做：

$("#container").delegate("span", "click", function() { 
    console.log($(this).text()); 
});

...然后单击跨度中的一个将显示其内容，如果我们做到这一点：

$("#container").append("<span>Four</span>");

...该跨度将自动处理，因为事件处理程序在容器上，然后在发生事件时检查选择器，所以稍后添加元素并不重要。

来源

2012-02-09 14:57:53

非常感谢。我要做的是研究代表并尝试一下。稍后会给你答复。非常感谢帮忙。将信息传递给做jQuery编码的同伴。 – 2012-02-09 15:09:30

回报：代表完美地工作。谢谢 – 2012-02-29 17:16:14

@AlexForce：很好，很高兴帮助！ – 2012-02-29 17:24:14

因为您在DOM完全加载后插入内容，所以您必须使用.on("click",function(){})来实现您的点击功能，因为当您绑定它们时，它们在DOM中不可用！

来源

2012-02-09 14:58:54

正如你可以看到jQuery's documentation：

通常情况下，当您添加使用$（“A”）点击（或其他事件）处理程序的所有链接点击（FN），你会发现在使用AJAX请求将新内容加载到页面后，事件不再有效。

当您调用$（'a'）时，它会在调用时返回页面上的所有链接，而.click（fn）将您的处理程序仅添加到这些元素。当添加新链接时，它们不受影响。请参阅AJAX和活动教程进行更长时间的讨论。

你必须处理这两种方式：

使用事件代表团

事件代表团是利用事件冒泡来捕获的DOM元素的任何地方事件的技术。

从jQuery 1.3开始，您可以使用活动和死亡方法进行事件委派，并使用事件类型的子集。从jQuery 1.4开始，您可以使用这些方法（与1.4.2中的委托和取消开始一起）用于几乎任何事件类型的事件委派。

对于早期版本的jQuery，请看Brandon Aaron的Live Query插件。您也可以手动处理事件委派，方法是绑定到一个公共容器并从那里收听事件。例如：

$('#mydiv').click(function(e){ 
    if($(e.target).is('a')) 
     fn.call(e.target,e); 
}); 
$('#mydiv').load('my.html');

这个例子将处理#mydiv内的任何元素的点击，即使添加单击处理时还不存在的话。

使用事件重新绑定

这种方法需要调用新的元素绑定方法，因为它被添加。例如：

$('a').click(fn); 
$('#mydiv').load('my.html',function(){ 
    $('#mydiv a').click(fn); 
});

来源

2012-02-09 15:14:48 DarkAjax

DOM在加载函数后没有响应jquery evers

回答

相关问题