jQuery无法识别类更改

时间:2013-12-12 12:25:19

标签: javascript jquery html

好的,我有一个编辑按钮,当我按下它时,它会变为“完成”按钮。

这一切都是由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>并按下它时,会显示警告。

如何解决?

4 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:0)

使用以下脚本:

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

答案 2 :(得分:0)

那是因为你不能为未来的元素注册点击事件,你必须这样做:

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

此方法提供了一种将委托事件处理程序附加到的方法   页面的文档元素,简化了事件处理程序的使用   将内容动态添加到页面时。

答案 3 :(得分:0)

试试这个:

$(".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");
        });