在我更改了类的元素上触发事件答案

【问题标题】：Fire events on elements that i've changed a class在我更改了类的元素上触发事件
【发布时间】：2014-04-09 05:48:29
【问题描述】：

如果我做错了，我很抱歉。这是我第一次在这里问东西。我也为我糟糕的英语感到抱歉。

看，我有麻烦了。我只为我和我的朋友创建了一个迷你社交网络。我是这个 jQuery/Ajax 的新手，所以他们说我的页面太静态了，他们必须做的任何事情，页面都被刷新了，这太糟糕了。然后我决定学习一些“动态”的东西，我开始遇到一些问题。

所以，我有一个“喜欢”（哈哈）按钮，我想创建一个“喜欢（撤消）”按钮。

我会尝试模拟我的问题：

<a class="like">Like</a>
$('.like').click(function(){
     //Like in database
     $(this).html('Like(Undo)');
     $(this).removeClass('like');
     $(this).addClass('like-undo');
});

所以，当我点击时，它会触发“like”类操作，而不是“like-undo”。谁能帮我？我已经快要死了。

如果我做错了什么，我很抱歉，再来一次。

【问题讨论】：

标签： javascript jquery

【解决方案1】：

事件处理程序绑定到元素。当您更改元素的类时，不会更改绑定到它的处理程序。幸运的是，在这种情况下，如果您使用 event delegation，您可以获得这种行为：

$('some-common-container').on('click', '.like', function() {
    //...
});

$('some-common-container').on('click', '.like-undo', function() {
    //...
});

【讨论】：

【解决方案2】：

正如你所说，现在你的页面是动态的，所以你告诉你的 js，当他们点击 .like 类触发该功能时，现在的问题是你正在删除类 .like，现在它有一个类 .like- undo 所以一个简单的解决方案是添加另一个函数来指示你的 js 如果你点击 .like-undo class 会做什么

$('.like').click(function(){
     //Like in database
    $(this).html('Like(Undo)');
    $(this).removeClass('like');
    $(this).addClass('like-undo');
});

$('.like').click(function(){ //notice you do opossite acctions
   //dislike in database
   $(this).html('Like');
   $(this).removeClass('like-undo');
   $(this).addClass('like');
});

希望对你有帮助！

【讨论】：