6

我有以下html：

        <ul id="contain">
         <li class="active_one"></li>
         <li class="two"></li>
        </ul>

和下面的jQuery：

$contain = $('#contain'); //going to use a lot

$contain.on('click','li.two', function(){
                console.log('working');
                //plus do other stuff
                });

以上不起作用，但是当我将其更改为：

$('body').on('click','li.two', function(){
                    console.log('working');
                    //plus do other stuff
                    });

然后它起作用了，但我知道最好的做法是尽可能靠近我尝试使用的父元素进行钻取，但每次我尝试这样做时，我显然做错了什么，因为我的父级选择器不工作。

4

2 回答 2

17

这意味着它#contain本身不是静态元素，你应该选择元素的最近的静态父元素。否则 jQuery 不会选择元素并且委托失败。

事件处理程序仅绑定到当前选定的元素；当您的代码调用 .on() 时，它们必须存在于页面上。

但是，如果该元素是静态的，那么您选择元素的时间过早，您应该等待 DOM 准备好。

$(document).ready(function(){
   var $contain = $('#contain'); //going to use a lot
   $contain.on('click','li.two', function(){
       console.log('working');
       //plus do other stuff
   });
})
于 2013-01-04T20:19:41.437 回答
1

因此，我将尝试解释 jquery on(change) 的工作原理，

如果你有

$(document).on('parameter 1','parameter 2', function(){} )

本质上，jquery 将检查是否执行了中提到的事件parameter 1。然后它会检查是否parameter 2存在，

如果是，那么它将检查 中提到的事件是否在 中提到parameter 1的元素中触发parameter 2。因此，您可以在文档更改时阻止 on(change) 事件。

这将通过确保加载的 elem 具有 id 然后将事件单独绑定到该 id 来帮助您绑定动态加载的元素。并且无论何时发生文档事件，都会执行动态事件。

于 2020-06-03T08:56:45.810 回答