Question

<ul class="thumbnails">
     <li class="span3">
         <div class="thumbnail text-center">
                     <a href="#" class="tip SetPrimaryImage" > <i class="icon-star-   empty"></i></a>
         </div>

    </li>

     <li class="span3">
         <div class="thumbnail text-center">
                     <a href="#" class="tip SetPrimaryImage" > <i class="icon-star-empty"></i></a>
         </div>

    </li>

    <li class="span3">
         <div class="thumbnail text-center">
                     <a href="#" class="tip SetPrimaryImage" > <i class="icon-star-empty"></i></a>
         </div>

    </li>

如果他们有班级偶像，我想改变兄弟姐妹的图标类。

所以无论我点击它应该将其他兄弟图标更改为icon-star-empty如果他们有班级偶像？

我无法通过以下方式实现：

$('this).siblings().find('i').removeClass('icon-star').addClass('icon-star-empty');

Answer 1

我假设您正在引用this来锚定元素。基于此，您可以使用：

$(this).closest('li').siblings().find('i').removeClass('icon-star').addClass('icon-star-empty');

<强> Working Demo

Answer 2

问题是，您在点击自身时更改了课程。这就是this会做的事情。您需要检查兄弟姐妹而不是当前元素。

试试这个：

$(this).parent().find('here-find-the-children').attr('icon-star-empty');

在更改之后，为当前的li元素保持相同的类：

$(this).attr('class', 'the-class-that-was');

这是一个完整的例子：

$('li').click(function () { /* click */
   var parentEl = $(this).parent(); /* ul */
   var childElparentEl.find('li'); /* all the li elements */
   childEl.attr('class', 'icon-star-empty'); /* class for all */
   $(this).attr('class', 'icon-star'); /* change the class for the current */
}

这就行了！

Answer 3

以下代码可能会对您有所帮助。

    $('a').click(function(){
    $('.thumbnails').find('i').removeClass('icon-star').addClass('icon-star-empty');    
        $(this).find('i').addClass('icon-star');

    })

如何用Jquery改变兄弟姐妹类？

3 个答案: