你能点击’jQuery中加载的内容吗？

我正在尝试创建一个页面，其中示例div是可点击的，因为它将在下面。

但是我试图这样做，如果用户点击徽标，它将使用加载重新加载原始内容。

发生此负载后，是否可以“点击”已加载的

？ 我正在尝试这一点，当点击file.php中的加载的

时，它无法提醒

        $(document).ready(function() { $("#example").click(function(){ alert("You clicked me!"); }); $("#logo").click(function(){ $("#main").load("file.php"); }); });     
 
This is content.
 
   

file.php包含

 
This is loaded content that can't be clicked? 

Answer 1

问题

问题是.click()只将事件绑定到那个时刻存在于DOM中的元素。 这意味着当您向页面添加新元素时，它不会绑定一个事件处理程序。

解

如果您使用的是jQuery 1.7+，而不是在代码中使用.on()而是使用.on() 。

 $("#main").on('click', '#example', function(){ alert("You clicked me!"); }); 

…或者使用旧版本的jQuery使用.live()代替：

 $("#example").live('click', function(){ alert("You clicked me!"); }); 

这将确保添加到DOM的新元素也将获得绑定到它们的事件处理程序。

Answer 2

试试这个，

 $("#example").live('click',function(){ alert("You clicked me!"); }); 

Answer 3

如果您使用的是jquery 1.7+，请使用“on”。

http://api.jquery.com/on/

从jQuery 1.7开始，不推荐使用.live（）方法。 使用.on（）附加事件处理程序。

Answer 4

问题是，在替换

的innerHTML后，

不再对其执行单击操作。

有几种方法可以解决这个问题：

首先，可能最好的方法是使用.on() ：

 $("#main").on('click', '#example', function(){ alert("You clicked me!"); }); 

这附加到#main ，因此，您对内容的处理方式无关紧要。 当事件冒出来时，它们会被on注意到，然后选择器将确定处理程序是否应该运行。

第二是现场直播。 以下内容将取代您当前对#example点击：

 $("#example").live('click', function(){ alert("You clicked me!"); }); 

这方面的一个缺陷是，jQuery会不断观察任何变化，这取决于你将拥有多少变化，这可能会使速度变慢（尽管在更快的机器上可能并不明显）。 此外， .live()已在1.7中弃用。

最后一个选项是在#logo点击上添加成功function。 我建议您创建一个方法，这样您就不会有重复的代码：

 var example_click = function() { alert("You clicked me!"); }; $("#example").click(example_click); $("#logo").click(function(){ $("#main").load("file.php", example_click); }); 

这意味着每次#main加载成功后，点击都会添加到#example 。 但这有点难看，因为你需要两次调用该函数。

Answer 5

尝试将example div的click()函数放在load函数的回调中。

Answer 6

jQuery 1.7为事件绑定和事件委托引入了.on() API：

 $("#main").on("click", "#example", function() { alert("You clicked me!"); });