Question

我有以下html结构：

<div class="links">
  <a href="#link_1">Link 1</a>
  <a href="#link_2">Link 2</a>
  <a href="#link_3">Link 3</a>
</div>

<div id="link_1" class="item open">
  <h3>Title 1</h3>
  <div class="details">
    <p>Lorem Ipsum dolor sit</p>
  </div>
</div>
<div id="link_2" class="item">
  <h3>Title 2</h3>
  <div class="details">
    <p>Lorem Ipsum dolor sit</p>
  </div>
</div>
<div id="link_3" class="item">
  <h3>Title 3</h3>
  <div class="details">
    <p>Lorem Ipsum dolor sit</p>
  </div>
</div>

默认某些＆＃39;项目＆＃39; div（s）将开放。我正在添加点击事件，以便链接到＆＃39;。我需要添加一个＆＃39; open＆＃39;相应项目组的类。

目前正在添加＆＃39; .open＆＃39;对所有＆＃39; div.item＆＃39; http://jsfiddle.net/rmbor/boc0c6ef/

非常感谢任何有关解释的帮助

Answer 1

尝试重写您的逻辑，如下所示，

var $href = $('.links a[href^="#"]');

$href.on('click', function(e) {
  e.preventDefault();
  $(this).parent().siblings('.item').eq($href.index(this)).addClass("open");
});

$(document).on('click', 'h3', function(e) {
  e.preventDefault();
  $(this).closest('.item')
    .toggleClass('open');
});

找到相应index代码的anchor。通过使用它访问相关的目标元素并向其添加类。

单击jQuery以定位组

1 个答案:

DEMO