Question

我正在尝试使用jquery点击功能添加和删除类。它适用于第一次点击，但我不知道为什么它不适用于第二次点击。它也没有显示任何错误。

这是html

<p class="right hand hidesubcategory">Hide</p>

脚本：

$('.hidesubcategory').click(function() {   
        $(this).text('Show');
        $(this).removeClass('hidesubcategory').addClass('showsubcategory'); 
});

$('.showsubcategory').click(function() {
        $(this).text('Hide');
        $(this).removeClass('showsubcategory').addClass('hidesubcategory');
});

提前致谢

Answer 1

在绑定时，没有带有.showsubcategory类的元素，因此永远不会发生绑定。

使用动态元素/绑定，您需要更新代码，如下所示。

$(document).on('click', '.hidesubcategory', function() {   
        $(this).text('Show');
        $(this).removeClass('hidesubcategory').addClass('showsubcategory'); 
});

$(document).on('click', '.showsubcategory', function() { 
        $(this).text('Hide');
        $(this).removeClass('showsubcategory').addClass('hidesubcategory');
});

供参考 - http://plnkr.co/edit/zCkzsnUmDXqV7cmvtP9g?p=preview

Answer 2

$(function(){
 $(document).on('click', 'p.right.hand', function() {   
        var thisItem = $(this);

        if(thisItem.text() == 'Hide'){
          thisItem.text('Show');
        } else {
          thisItem.text('Hide');
        }

        if(thisItem.hasClass( "hidesubcategory" )){
          thisItem.removeClass('hidesubcategory').addClass('showsubcategory');
        } else {
          thisItem.removeClass('showsubcategory').addClass('hidesubcategory');
        }


});
});

Answer 3

试试这段代码。

$(document).ready(function() {
    $('.hidesubcategory').live("click",function () {
        $(this).text('Show');
        $(this).removeClass('hidesubcategory').addClass('showsubcategory');
    });

    $('.showsubcategory').live("click", function () {
        $(this).text('Hide');
        $(this).removeClass('showsubcategory').addClass('hidesubcategory');
    });
});

jquery的问题在添加和删除类时单击事件

3 个答案: