jQuery的 – 我如何将事件绑定到将在稍后显示的隐藏的元素?

我正在尝试将“点击”事件附加到特定类的所有元素。 问题是一些元素是在事件被绑定时隐藏的(display:none)选项卡上的。 (.bind())。 看来,当这些元素被显示时,事件不再受限制。

$('a.someClass').bind('click', function(){ alert("test"); }); 

隐藏的元素似乎没有单击事件绑定。 如果我select隐藏的元素:

 $('a.someClass:hidden').bind('click', function(){ alert("test"); }); 

当这些元素不再隐藏时,似乎点击事件没有被绑定。 有没有人经历过这个? 有没有办法绑定和事件的元素,无论其显示属性?

谢谢

2年后编辑 :正如有些人指出的那样, Livefunction现在已经被弃用了(你也可以在链接文档页面的顶部看到)。 当前版本的正确事件处理程序名称为On 。 马克西姆的答案就是一个很好的例子。

原始答案:
你有没有尝试使用Live() ?

 .live('click',function(){/* code */}); 

版本说明: live已经在jQuery 1.7中被弃用了,并且在jQuery 1.9中被删除了。 这个答案只适用于比jQuery 1.7更早的jQuery版本

从jQuery 1.7开始, .live()方法已被弃用。

您现在可以使用.on()方法。 通过将委托事件附加到jQuery运行时在HTML中可查看的元素。

所以,如果在运行jQuery时隐藏a.someClass则应该将一个委托事件附加到主体,以便在将来有一个可见的a.someClass元素时运行,例如:

 $('body').on('click','input.a.someClass',function(){ alert("test"); }); 

使用委托(请注意这是你取消隐藏后):

 $('body').delegate('.someClass', 'click', function (evt) { // do something here }); 

使用

 $('parentelement').on('click','taget element',function(){ }) 

在加载页面时应该显示parentelement

根据http://api.jquery.com/live/上的jquery文档;

将事件的处理程序附加到与当前select器匹配的所有元素,现在和将来

这是一个如何使用它的例子:

 <!DOCTYPE html> <html> <head> <style> p { background:yellow; font-weight:bold; cursor:pointer; padding:5px; } p.over { background: #ccc; } span { color:red; } </style> <script src="jquery-1.5.js"></script> </head> <body> <p>Click me!</p> <span></span> <script> $("p").live("click", function(){ $(this).after("<p>Another paragraph!</p>"); }); </script> </body> </html> 

时代已经改变了,现在要用“.on”

.on('click',function(){/* code */});