用相同的类

Question

如果我点击＆＃34; clickme＆＃34;我正在寻找一个解决方案来切换下一个.info div。我用next()等尝试过很多东西，但没有任何作用。

＆＃13;

＆＃13;

$(document).ready(function(){
  $(function(){
    $(".clickme").click(function(){
      $(".info").slideToggle();
    });
  }); 
}); 

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="mbox">
  <div class="mbox-inner">
    <div class="mbox-left"><span class="mstep">1.1</span>Great</div>
    <div class="mbox-right">
      <select class="ignore" id="modul1_1">
        <option value="0">a</option>
        <option value="1">b</option>
      </select>
      <div class="clickme">Click</div>
    </div>
  </div>
</div>
<div class="info">Lorem ipsum dolor sit amet, consetetur sadipscing</div>

<div class="mbox">
  <div class="mbox-inner">
    <div class="mbox-left"><span class="mstep">1.2</span>Greater</div>
    <div class="mbox-right">
      <select class="ignore" id="modul1_2">
        <option value="0">a</option>
        <option value="1">b</option>
      </select>
      <div class="clickme">Click</div>
    </div>
  </div>
</div>
<div class="info">Lorem ipsum dolor sit amet, consetetur s</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您可以使用 closest() 和 next() 来实现这一目标：

$(function(){
    $(".clickme").click(function(){
        $(this).closest('.mbox').next(".info").slideToggle();
    });
}); 

$(this)引用点击的元素，.closest('.mbox')将获得点击项的类mbox的父级，然后.next(".info")将选择该类的下一个元素info。

注意：无需使用两个就绪功能。

希望这有帮助。

＆＃13;

＆＃13;

$(function(){
  $("<div><a class=\"close\" href=\"#\">Hinweis schliessen</a></div>").appendTo(".info");
  
  $(".clickme").click(function(){
    $(this).closest('.mbox').next(".info").slideToggle();
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="mbox">
  <div class="mbox-inner">
    <div class="mbox-left"><span class="mstep">1.1</span>Great</div>
    <div class="mbox-right">
      <select class="ignore" id="modul1_1">
        <option value="0">a</option>
        <option value="1">b</option>
      </select>
      <div class="clickme">Click</div>
    </div>
  </div>
</div>
<div class="info">Lorem ipsum dolor sit amet, consetetur sadipscing</div>

<div class="mbox">
  <div class="mbox-inner">
    <div class="mbox-left"><span class="mstep">1.2</span>Greater</div>
    <div class="mbox-right">
      <select class="ignore" id="modul1_2">
        <option value="0">a</option>
        <option value="1">b</option>
      </select>
      <div class="clickme">Click</div>
    </div>
  </div>
</div>
<div class="info">Lorem ipsum dolor sit amet, consetetur s</div>

＆＃13;

＆＃13;

＆＃13;