0

这个简单的 jQuery 在我使用on. 还有其他方法可以使用on吗？不适on用于class. 我在用着jQuery JavaScript Library v1.8.3

我正在尝试将一些旧代码live()从on().

$(".subUser").on("click",function() {
  alert("The paragraph was clicked.");
});

<div class="container">
    <div><i class="icon-add subUser"></i></div>
</div>
4

3 回答 3

2

如果您不subUser动态添加带有类的元素，您的代码似乎没问题。您可能需要放入 document.ready

$(document).ready(function(){
  $(".subUser").on("click",function() {
     alert("The paragraph was clicked.");  
  });
});

如果您要动态添加元素，那么您需要事件委托。您必须使用在执行绑定代码时存在的选择器中的父元素，或者您可以使用文档或正文。

$(document).ready(function(){
  $(document).on("click", ".subUser", function() {
     alert("The paragraph was clicked.");  
  });
});

委托事件的优点是它们可以处理来自以后添加到文档的后代元素的事件。通过选择一个在附加委托事件处理程序时保证存在的元素，您可以使用委托事件来避免频繁附加和删除事件处理程序Reference。

于 2013-11-14T06:55:28.897 回答
0

然后您可以更改为：

$(".container").on("click", ".subUser" ,function() {

当您将代码从.live()那里移动时，.on()您必须将事件委托给在 dom 更改之前可用的静态父级。

因此，在您的情况下，似乎.container该类在那个时间点可用，那么您必须委托给它，或者您可以$(document)直接委托给它，因为文档始终可用于委托事件（this might be little slower）。

于 2013-11-14T06:55:54.270 回答
0

检查这个你应该如何替换你的代码

        // Bind
        $( "#members li a" ).on( "click", function( e ) {} );
        $( "#members li a" ).bind( "click", function( e ) {} );

        // Live
        $( document ).on( "click", "#members li a", function( e ) {} );
        $( "#members li a" ).live( "click", function( e ) {} );

        // Delegate
        $( "#members" ).on( "click", "li a", function( e ) {} );
        $( "#members" ).delegate( "li a", "click", function( e ) {} );

参考

http://www.elijahmanor.com/2012/02/differences-between-jquery-bind-vs-live.html

于 2013-11-14T07:08:13.610 回答