Question

我在构建一些jquery时遇到了麻烦，它抓取了一个在前一个事件之后被修改过的选择器。

例如，我有一些看起来像这样的HTML：

<div class='1'>test</div>

如果我点击以下内容：

$(".1").click(function(){
    alert('found 1!'); 
    $(this).attr('class', '2');
});

警报有效，当我检查元素时，该类已切换为“2”

现在当我再次点击它时，使用以下内容：

$(".2").click(function(){
    alert('found 2!'); 
    $(this).attr('class', '1');
});

我仍然'找到了1'！作为警报。

我出于某种原因正在尝试不可能，我做错了还是有更好的方法呢？谢谢！

Answer 1

您需要使用jquery .on() （或 .delegate() ）函数来绑定动态更新元素的事件。

如下面的代码，

$(".1").on("click", function(){
    alert('found 1!'); 
    $(this).attr('class', '2');
});

$(".2").on("click",function(){
    alert('found 2!'); 
    $(this).attr('class', '1');
});

Answer 2

.click（）仅在执行时绑定。你要找的是.live（）或.on（）。我将使用.on（），jQuery 1.7语法：

$(document).on("click", ".1", function() {
  console.log('1 clicked');
  $(this).attr('class', '2');
});
$(document).on("click", ".2", function() {
  console.log('2 clicked');
  $(this).attr('class', '1');
});

Answer 3

执行此操作时：

$(".1").click(function()

您绑定到特定的DOM元素。一旦受到限制，对象上的类就不再重要了。事件处理程序绑定到对象本身。 jQuery执行此语句的方式是它找到class="1"的所有DOM对象并在其上设置事件侦听器。

如果您希望事件处理程序处理页面的动态更改，那么您需要使用jQuery的.live()或.delegate()（jQuery 1.6或更早版本）或jQuery的.on()（jQuery 1.7+））。

Jquery修改了选择器类没有被拾取

3 个答案: