1

需要一些帮助来提出这个 jQuery，有一次我几乎让它工作，除了标题被放置在<p class="category-flag-text"></p>页面上的每个文本中，不仅仅是在文章中，而且甚至无法回到那个点。

当悬停在.category-icons a我想在同一父文章中使用.category-icons a作为文本的标题属性时。<p class="category-flag-text"></p>

<article class="post-1">
  <div class="category-flags">
    <p class="category-flag-text"></p>
  </div>

  <div class="category-icons">
    <a href="http:/www..." title="Category One">
      <img src="http:/www..." alt="Category One" title="Category One">
    </a>
    <a href="http:/www..." title="Category Two">
      <img src="http:/www..." alt="Category Two" title="Category Two">
    </a>
  </div>
</article>

<article class="post-2">
  <div class="category-flags">
    <p class="category-flag-text"></p>
  </div>

  <div class="category-icons">
    <a href="http:/www..." title="Category One">
      <img src="http:/www..." alt="Category One" title="Category One">
    </a>
    <a href="http:/www..." title="Category Two">
      <img src="http:/www..." alt="Category Two" title="Category Two">
    </a>
  </div>
</article>
4

2 回答 2

1

非常坦率的。只需用于$(this).closest('article')定位最近的文章祖先。然后，你可以找到<p>你想要的。

$(".category-icons a").on('mouseover', function () {
    $(this).closest('article').find('.category-flag-text')
        .text($(this).attr('title'));
}).on('mouseout', function () {
    $(this).closest('article').find('.category-flag-text').text('');
});

http://jsfiddle.net/ExplosionPIlls/bnB5h/

于 2013-02-07T03:02:42.547 回答
1

您可以像这样使用.closest()：

$(function(){
  $('.category-icons a').hover(function(){
    $(this).closest('article').find('p.category-flag-text').text($(this).prop('title'));
  }, function(){
    $(this).closest('article').find('p.category-flag-text').html('');
  });
});

演示：http: //jsbin.com/akoton/1/edit

于 2013-02-07T03:07:11.590 回答