jQuery不是動態添加的類的選擇器

Question

我想在一個喜歡的按鈕上添加一個點擊事件。 單擊后，我要添加一個名為active的類。 當元素具有此類時，我不希望觸發click事件。

為什么此日志“被點擊”！ 每次都不僅是第一次？

http://jsfiddle.net/M5MRQ/

<div class="vote">
    <a class="vUp">Like me</a>
</div>

$(".rate .vUp").not(".active").click(function(){
    console.log("click!");
    $(this).addClass("active");
    return false;
});

Answer 1

您可以簡單地使用.off()在單擊時取消綁定事件

$(".rate .vUp").click(function(){
    console.log("click!");
    $(this).addClass("active");

    //Unbind event
    $(this).off("click");
    return false;
});

演示

Answer 2

這是因為，您的DOM在運行時會更改，但您的JS不會更改。 您需要一個實時方法，或者更好的方法是，刪除按鈕上的點擊處理程序，如下所示：

$(".rate .vUp").click(function(event){
    console.log("click!");
    $(this).addClass("active");
    $(event.currentTarget).unbind("click");
    event.preventDefault();
    return false;
});

看到這里http://jsfiddle.net/M5MRQ/7/

Answer 3

嘗試使用以下代碼：

$(".rate .vUp").click(function(){
    if($(this).hasClass("active")){
        return false;
    }else{
        console.log("click!");
        $(this).addClass("active");
    }             
});

Answer 4

您也可以使用hasClass（）方法來獲得一個有效的示例：

$(".rate .vUp").click(function(){
    if (!$(this).hasClass("active")) {        
        console.log("click!");
        $(this).addClass("active");
        event.preventDefault();
        return false;
    }
});

參見http://jsfiddle.net/M5MRQ/9/