jquery - 调用新创建的类

Question

只是乱搞，我知道为什么这不起作用，但我没有看到任何其他方法......

简单的功能:

$(".click").on("click", function() {
    alert("first click");
    $(this).removeClass("click");
    $(this).addClass("next");
});
$(".next").on("click", function(){
    alert("second click");
});

但是，我总是收到“首次点击”警报。所以我知道这是因为创建页面时 next 类不存在...

什么是解决这个问题的好方法？

这是我的测试 fiddle :

http://jsfiddle.net/tUp9R/1/

Answer 1

您可以使用事件委托(delegate):http://jsfiddle.net/tUp9R/4/

jQuery 文档:https://learn.jquery.com/events/event-delegation/

Javascript:

$(".test").on("click", ".click", function() {
    alert("first click");
    $(this).removeClass("click");
    $(this).addClass("next");
});

$(".test").on("click", ".next", function() {
    alert("second click");
});

HTML:

<div class="test">
    <button class="click">Click Me</button>
</div>

您还可以通过使用事件数据来简化它，如下所示:http://jsfiddle.net/tUp9R/7/

$(".click").on("click", {first: true}, function(e) {
    if (e.data.first) {
        alert("first!")
        e.data.first = false
    } else {
        alert("not first :)")
    }
})