jQuery無法識別類更改

Question

好的，我有一個編輯按鈕，當我按下它時，它變為“完成”按鈕。

一切都由jQuery完成。

        $(".icon-pencil").click(function() {
            var pencil = $(this);
            var row = $(this).parent('td').parent('tr');
            row.find('td').not(":nth-last-child(2)").not(":last-child").each(function() {
                $(this).html("hi");
            });

            pencil.attr('class', 'icon-ok-sign');
        });

        //  save item
        $(".icon-ok-sign").click(function() {
            alert("hey");
        });

當我按下“編輯”（“ .icon-pencil ”）按鈕時，其類將更改為.icon-ok-sign （我在chrome控制台中可以看到），

但是當我單擊它時，沒有顯示警報。

當我創建一個<span class="icon-ok-sign">press</span>並在其上按下時，將顯示警報。

怎么解決呢？

Answer 1

嘗試使用$( document ).on( "click", ".icon-ok-sign", function() {...

Answer 2

那是因為您不能為將來的元素注冊點擊事件，所以您必須這樣做：

$(document).on('click', '.icon-ok-sign', function() {
 alert('hey');
});

此方法提供了一種將委派事件處理程序附加到頁面的document元素的方法，從而可以在將內容動態添加到頁面時簡化事件處理程序的使用。

Answer 3

使用以下腳本：

$(document).on('click','.icon-ok-sign',function(){
alert("hey");
});

Answer 4

嘗試這個：

$(".icon-pencil").click(function() {
            var pencil = $(this);
            var row = $(this).parent('td').parent('tr');
            row.find('td').not(":nth-last-child(2)").not(":last-child").each(function()            {
                $(this).html("hi");
            });

            pencil.removeAttr('class').addClass('icon-ok-sign');
        });

        //  save item
        $(".icon-ok-sign").click(function() {
            alert("hey");
        });