0

我在取消绑定特定元素上的单击事件时遇到问题。这是我的 JS 代码。

    $(document).on('click','.likecomment', function(e){
        e.preventDefault();
        var commentid = $(this).data('commentid');
        $.ajax({
            type: 'POST',
            url: '?category=likecomment',
            data: {
                "commentid" : commentid
            },
            success: function(){
                $(this).unbind('click');
                var likes = $('#'+commentid+'-likes').text();
                likes++;
                $('#'+commentid+'-likes').html(likes);
            }
        });
    return false;
});

单击后，元素的功能将保持不变。第一次点击后如何防止它被点击？如果代码正确，我可能会自己找出问题，但我只想确保代码正确与否。

4

3 回答 3

3

使用匹配的 .off 语法。

$(document).off('click','.likecomment');

或使当前元素不再匹配.likecomment

$(this).removeClass("likecomment");

或者

$(this).removeClass("delegated");
// with this change to binding method:
$(document).on('click','.likecomment.delegated', function(e){

但是请记住，this成功调用的内部与this外部不同，您需要添加此 ajax 选项：context: this,以便thisajax 内部与 ajax 外部相同。

于 2012-10-19T14:36:36.347 回答
1

这可能是因为您在成功处理程序中解除绑定。如果您的 ajax 调用需要一段时间，那么您的解除绑定也需要一段时间。所以在你的 $.ajax 尝试之后：

$(this).prop({disabled: true});
于 2012-10-19T14:36:01.203 回答
1

因为您将事件委托给document对象，所以处理程序绑定在 上document，而不是每个单独的.likecomment元素上。

如果委托事件匹配多个元素，您不希望取消绑定该事件，并且您可能不希望删除likecomment该类，因为它可能与样式相关联。

相反，请使用在添加另一个类时强制不匹配的选择器。done本示例使用的是finished,liked或您喜欢的其他类名：

$(document).on('click', '.likecomment:not(.done)', function () {...});

当你想阻止元素引起点击事件时，将done类添加到元素中：

$(this).addClass('done');

添加新类还提供了一个钩子，用于更改 的样式likecomment，使其看起来不再可点击。

于 2012-10-19T14:41:20.340 回答