1

トリガーを介して表示/非表示にする必要がある一連の複数の独立した div があります。これまでのところ、私が持っている jquery コードは、クリックされた div を表示しますが、非表示部分は機能しません。

これが私のjQueryです：

$(".show_options_div").click(function() { 
  $(this).next(".toggleOptions").slideToggle("normal");         
  $(this).slideToggle("fast");  
});

$(".hide_options_div").click(function() {
  $(this).prev(".toggleOptions").slideToggle("normal");         
  $(this).prev(".show_options_div").slideToggle("fast");    
});

HTMLは次のとおりです。

<a class="show_options_div" style="display:block;">
    <div class="drop_down_arrow"></div>
</a>

<div class="toggleOptions" style="display: none">    
  <a class="hide_options_div">
    <div class="drop_up_arrow"></div>
  </a>
</div>

<a class="show_options_div" style="display:block;">
    <div class="drop_down_arrow"></div>
</a>

<div class="toggleOptions" style="display: none">
  <a class="hide_options_div">
    <div class="drop_up_arrow"></div>
  </a>
</div>


<a class="show_options_div" style="display:block;">
    <div class="drop_down_arrow"></div>
</a>

<div class="toggleOptions" style="display: none">
  <a class="hide_options_div">
    <div class="drop_up_arrow"></div>
  </a>
</div>
4

1 に答える 1

2

非表示機能で

$(this).prev(".show_options_div").slideToggle("fast");

prev メソッドは直前の要素のみを検索します。これは .show_options_div ではないため、何も検索されません。

.show_options_div は .toggleOptions の prev 要素なので、

$(this).parent(".toggleOptions").prev(".show_options_div").slideToggle("fast");

そしてその

$(this).prev(".toggleOptions").slideToggle("normal");

に変更する必要があります

$(this).parent(".toggleOptions").slideToggle("normal");

参考のため

jQuery 前へ()

于 2013-03-18T22:00:02.310 に答える