2

私はいくつかの調査を行いましたが、何も機能していないようです。これは、HTML の後に、私がまとめている JavaScript が続きます。私がやろうとしているのは、dashboard_gear_options がクリックされるたびに、適切な非表示のオプション行を切り替えるように設定することです。コードの各ブロックは、ページ上のさまざまな場所に複数回存在します。this、find、parent、next、children を使用してみましたが、役に立ちませんでした。

HTML:

// start block
<div class="content_block_holder">
   <div class="content_top">
      <div class="dashboard_gear_options"></div>
      <div class="dashboard_gear_divider"></div>
   </div>
   <div class="dashboard_holder">
      <div class="hidden_options_row"></div>
   </div>
</div>
// end block

// start block
<div class="content_block_holder">
   <div class="content_top">
      <div class="dashboard_gear_options"></div>
      <div class="dashboard_gear_divider"></div>
   </div>
   <div class="dashboard_holder">
      <div class="hidden_options_row"></div>
   </div>
</div>
// end block (etc..)

JS:

$(document).ready(function(){
   $('.dashboard_gear_options').click(function(){
       $(this).parent('.content_block_holder').find('.hidden_options_row').toggle();        
    });
});
4

3 に答える 3

3

セレクターで親の代わりにclosest([selector])( http://api.jquery.com/closest/ )を使用してみてください。ツリーをたどって「content_block_holder」を見つけます。parent([selector])直接の親をチェックし、提供されたセレクターと一致しない場合は空のセットを返します。

$(document).ready(function(){
   $('.dashboard_gear_options').click(function(){
       $(this).closest('.content_block_holder').find('.hidden_options_row').toggle();        
   });
});

コードに基づく JSFiddle: http://jsfiddle.net/gK7yM/

于 2012-07-29T16:46:09.493 に答える
2

これを試して

$(this).closest('.content_block_holder').find('.dashboard_holder').find('.hidden_options_row').toggle();        
于 2012-07-29T16:43:55.120 に答える
0

このチェーンも機能します:

$(this).parent().next('.dashboard_holder').children('.hidden_options_row').toggle();

また

$(this).parent().next('.dashboard_holder').find('.hidden_options_row').toggle();
于 2012-07-29T16:57:05.757 に答える