0

有人可以告诉我我在这里做错了什么。尝试将类属性删除/添加到 li 以便在单击时激活正确的属性：http: //jsfiddle.net/cyberpuunk/D2RLR/2372/

<div class="container">        
          <div class="span8">
              <ul class="nav nav-tabs gallery-nav">
                <li class="active">
                  <a href="#"<strong>All</strong></a>
                </li>
             <li><a href="#"><strong>link1</strong></a></li>
           <li><a href="#"><strong>link2</strong></a></li>
             </ul>
              </div>
   <div class="row">
       <div class="span12">
           <div class="page1">qwer</div>
            <div class="page1">asdf</div>
            <div class="page1">zxcv</div>
       </div>  
    </div>    
</div>


$('.page1:gt(0)').hide();

$('ul.gallery-nav li').click(function(e) {
    e.stopPropagation();
    var liIndex = $(this).index();
    $('.page1').hide().eq(liIndex).show();
    $(this).removeClass("active");
    eq(liIndex).addClass("active");
}); // end click
4

2 回答 2

2 
$('ul.gallery-nav li').click(function(e) {
    e.stopPropagation();
    $('.page1').hide().eq($(this).index()).show();
    $('ul.gallery-nav li').removeClass("active");
    $(this).addClass("active");
});

小提琴

你有一个语法错误

eq(liIndex).addClass("active");

.eq()是一个 jQuery 对象方法，而不是一个可以单独使用的函数。这可以通过使用来解决，$('ul.gallery-nav li').eq(liIndex).addClass("active");但是仍然会有一个逻辑缺陷：

$(this).removeClass("active");

您应该add而不是remove类，因为this引用单击li而不是您将处理程序附加到的整个列表项组。话虽如此，您的代码的固定版本是：

    $('ul.gallery-nav li').removeClass("active");
    $(this).addClass("active");
//as $(this) references the clicked li, you don't need $('ul.gallery-nav li').eq(liIndex)
于 2012-10-06T17:43:25.990 回答
2

出于一个奇怪的原因，您正在编码$(this).removeClass('active')，请注意您应该首先创建一个 jQuery 对象然后调用eq方法，请尝试以下操作。

$('ul.gallery-nav li').click(function(e){
     e.stopPropagation();
     var liIndex = $(this).index();
     $('.page1').hide().eq(liIndex).show();
     $(this).addClass("active").siblings().removeClass('active')
});

http://jsfiddle.net/54Xdr/

于 2012-10-06T17:43:34.787 回答