取消绑定div，然后再绑定它

Question

$('.tab').click(function() {
    $(this).unbind("click");
    var classy = $(this).attr("class").split(" ").splice(-1);
    var ihtml = $('.content.'+classy).html();
    $('#holder').html(ihtml);
    $('.tab').removeClass('highlight');
    $(this).addClass('highlight');
    $(this).unbind("click");
});

因此，在这段代码中，我基本上有一个选项卡式界面。当我再次单击选项卡时，＃holder中的信息消失了。因此，我想做的是每当用户单击选项卡时取消绑定单击，然后在切换选项卡时将其绑定。如何将其集成到我的代码中？

谢谢。

Answer 1

[您可以尝试在单击选项卡时添加一个'active'类（通常是一种很好的做法），然后使用jQuery的live()做一些花哨的事情...

$('.tab:not(.active)').live('click', function () { 
    $('.tab').removeClass('active');
    $(this).addClass('active');
    ... 
});

我想这可以解决问题。

Answer 2

此外，您可以尝试使用这种语法（应该更快，并且对内存和CPU友好）：

$('.tab').click(function () {
    var t = $(this);
    if (t.hasClass('active')) { return false; }
    $('.active').removeClass('active');
    t.addClass('active');
    /* do some stuff here */
    return false;
});

甚至更好，以避免重复自己：

$('.tab').click(function () {
    var t = $(this);
    if (!t.hasClass('active')) {
        $('.active').removeClass('active');
        t.addClass('active');
        /* do some stuff here */
    }
    return false;
});

为什么这样更快且对CPU友好？因为您只绑定一次。当您使用live绑定方法时，浏览器将侦听DOM中的任何更改。