jQuery的：运行命令只有在所选元素具有

Question

类

我必须设置使用下列结构来自动检测新的选项卡的标签系统：

<a href="#div1id">Show div 1</a> 
<div id="div1id">Div1</div> 

的事情是，我需要禁用重新加载能力通过单击已显示的选项卡选项卡。我曾尝试使用.hasClass（）和.is（）来检测点击的选项卡是否已应用'.active'，但没有运气。

这里是我的动画，改变当前代码：

$(document).ready(function(){ 
$("#tabs li").click(function() { 
    $("#tabs li").removeClass('active'); 
    $(this).addClass("active"); 
    $(".content").hide(); 
    var selected_tab = $(this).find("a").attr("href"); 
    $(selected_tab).fadeIn(); 
}); 
}); 

Answer 1

您可以使用.delegate()既让它多一点效率，解决您的问题，如下所示：

$(function(){ 
    $("#tabs").delegate("li:not(.active)", "click", function() { 
    $("#tabs li").removeClass('active'); 
    $(this).addClass("active"); 
    $(".content").hide(); 
    $($(this).find("a").attr("href")).fadeIn(); 
    }); 
}); 

使用的BU在选择器中，click处理程序只会在:not()具有.active类时执行......还有一个事件处理程序，而不是n事件处理程序，每个<li>一个。

Answer 2

也许click事件的简单替代

$(".active").click(function(){ 
     return false; 
}); 

Answer 3

应该没有理由为什么以下不应该工作。

$(document).ready(function(){ 
    $("#tabs li").click(function() { 
     if (!$(this).hasClass('active')) { 
      $("#tabs li.active").hide(); 
      $("#tabs li.active").removeClass('active'); 
      $(this).addClass("active"); 
      $("#tabs li.active").fadeIn(); 
     } 
    }); 
});