2

我创建了一个函数，在li单击元素时淡入一些描述性信息。该函数淡化列表中的新信息。不工作的线路是$(".hover").not(".hover", this).fadeOut(200).removeClass("not-me");并且理解它是下降到.not(".hover", this).

我已经尝试过.not(this)，但这不能正常工作。大概是因为this它的部分还是从li元素中选取的，最初是从点击函数中选取的$("ul li").click(function() {。

有没有办法.not(".hover", this)成功使用？

jQuery：

$("ul li").click(function() {

  // Remove other divs with element currently shown
  $(".hover").not(".hover", this).fadeOut(200).removeClass("not-me");

  // Stop chosen element from fading out
  $(".hover", this).addClass("not-me").fadeIn(200);

});

HTML：

<li>
  <div class="hover">
     <h3>Header</h3>
     <p>Shot but breif description, cut me off if you need to.</p>
   </div>
   <img src="/images/1.jpg" alt="" />
</li>
<li>
  <div class="hover">
     <h3>Header</h3>
     <p>Shot but breif description, cut me off if you need to.</p>
   </div>
   <img src="/images/2.jpg" alt="" />
</li>
<li>
  <div class="hover">
     <h3>Header</h3>
     <p>Shot but breif description, cut me off if you need to.</p>
   </div>
   <img src="/images/3.jpg" alt="" />
</li>
4

3 回答 3

3

我想你正在寻找这个：

$("li").not(this).find(".hover");

这将为您提供所有.hover元素，不包括this.

您可能应该缓存该$('li')对象...

于 2013-02-01T05:05:11.923 回答
1

.not只接受一个论点。而且，任何事情都不可能满足$(".hover").not(".hover")。只需使用$(".hover").not(this)

http://api.jquery.com/not/

于 2013-02-01T05:05:41.543 回答
1

当您使用.siblings(). 从某种意义上说，它也是锚定的，它不考虑<li>当前的外部<ul>因素。

话虽如此，如果您稍后向页面添加更多列表，则您的初始选择器（$('ul li')除非有意）可能不合适。

$("ul li").click(function() {

  // Remove other divs with element currently shown
  $(this)
      .siblings() // get sibling li's
          .find('.hover') // and fadeout their inner .hover divs
              .fadeOut(200)
              .removeClass("not-me")
              .end()
          .end()
      .find('.hover')
          .fadeIn(200)
          .addClass("not-me")
});
于 2013-02-01T05:13:01.120 回答