Question

也许我这样做不正确/效率不高但这不适合我：

$(document).ready(function(){

    $('li.taglink').click(function(){
        alert('clicked tag');
        $userClicked = $(this).html();
        $('#holder').children('div').each(function () { 
            $('li.taglinkcurrent').removeClass('taglinkcurrent').addClass('taglink');                                       
            $x = $(this).attr("tags");
            ele = $x.split(',');
            for (var i = 0; i < ele.length; i++) 
            {
            if ($userClicked == ele[i]) {$(this).show(495); break;} 
                                    else {$(this).hide(495);}   
            }
        });
        $(this).removeClass('taglink').addClass('taglinkcurrent');
    });

    $('li.taglinkcurrent').click(function(){
        alert('clicked current');
        $('li.taglinkcurrent').removeClass('taglinkcurrent').addClass('taglink');                               
        $('li.taglink').show(495);
    });

});

该页面包含带有“tags”属性的div，其中包含多个标记。我还有一个无序列表，每个li元素包含各个标签。当用户单击其中一个li元素时，它会显示具有该标记的所有div，并隐藏其他所有内容。如果用户单击相同的li元素，则会再次显示所有内容。我添加了警报以测试发生了什么，每次我点击一个链接时，它会弹出“点击链接”，即使李的班级已经切换到.taglinkcurrent。我做错了什么想法？

Answer 1

首次运行代码时，您绑定到click()事件，因此"taglink"类是唯一正在运行的类。

要根据对dom的更改来更改函数，请使用on()方法：

http://api.jquery.com/on/

$(document).on("click", "li.taglink", function() { 
  // ... 
});

使用on()方法有很多警告 - 请参阅上面的文档以获取更多详细信息。

编辑：将'live'更改为'on'，从v1.7开始，这是首选方法。

Answer 2

我认为事件归因于加载时的每个li，并且后续的类更改不会取消绑定事件。但是你可以这样轻松地解决这个问题，我想：

$('li').click(function() {
    if ( $(this).hasClass("taglink") ) {
        alert("clicked tag");
        ...
    } else if ( $(this).hasClass("taglinkcurrent") ) {
        alert('clicked current');
        ...
    }
});

jquery在.removeClass（）之后没有识别新类.addClass（）？

2 个答案: