Question

我使用$.click()方法触发某些事件。但是之后我需要在声明元素之前为某些HTML元素设置一些事件。我们以此为例：

<script>
    $('div.hide').click(function() {
        $('div.hide').css({'display' : 'none'});
     });
</script>
<div class="hide">some text</div>

缺点是设置.click()方法时，div.hide元素不存在，因此没有设置触发器。

所以我转向.on()方法，如下所示：

<script>
    $('div.hide').on('click', function() {
        $('div.hide').css({'display' : 'none'});
    });
</script>
<div class="hide">some text</div>

但这也行不通。我认为调用.on()会使所有现有和未来的div.hide元素触发'click' function()。

我设法克服了这种不便，但据我所知，我想知道我做错了什么。有没有办法为未来的HTML元素分配触发器？

我的说法是：

<script>
    $(document).ready( function() {
        $('div.hide').click(function() {
            $('div.hide').css({'display' : 'none'});
        });
    });
</script>
<div class="hide">some text</div>

Answer 1

你错过了三个版本的版本：

$('body').on('click', 'div.hide', function() { ... });

将处理程序放在<body>上，但是当目标元素与选择器（第二个参数）匹配时，它会捕获冒泡并调用处理程序的事件。

处理程序不必继续<body>;它可以是<div>的任何父容器元素。

“on”方法取代了旧的“live”和“delegate”方法，以及“绑定”本身。

Answer 2

使用jQuery.live method为当前和未来与当前选择器匹配的所有元素附加事件处理程序

不确定.on（）方法

2 个答案: