jQuery函数需要单击两次

Question

如果存在一个特定的类('current')，当单击一个标签时，我需要调整一个元素的CSS。单击选项卡时，将添加类“current”。我的代码可以工作，但它需要两次点击-我认为是因为在第一次点击时，类被添加了，然后在第二次点击时，jQuery会检测到它。下面是jquery代码：

    $('ul.tabs a').click(function() {
     if($('a#tab5').hasClass('current')) {
        $('#rightCorner').css("top","1px");
     } else {
        $('#rightCorner').css("top","7px");
     };
})

有没有办法让它只需点击一下就能工作？

谢谢-乔

Answer 1

您可以将添加current类的代码和监视tab5的单击处理程序组合在一起吗？这允许您添加类，然后执行检查。在您的情况下，操作顺序出现了问题。

$('ul.tabs a').click(function() {     
     $('ul.tabs a').removeClass('current');
     $(this).addClass('current');
     if (this.id == 'tab5') {
          $('#rightCorner').css("top","1px");
     }
     else {
          $('#rightCorner').css("top","7px");
     }
})

更新：

使用CSS而不是if语句来处理tab 5可能更容易一些。

ul.tabs a#tab5 { top: 7px; }
ul.tabs a#tab5.current { top 1px; }

Answer 2

在else分支中，您可能需要添加

$('a#tab5').addClass('current');