0

順序付けされていないリストを含むdivがいくつかあります。それらのリストアイテムの中には、クリックできるボタンがあります。1ボタンをクリックし、「選択済み」のクラスを追加して、そのul内のすべてのリストアイテムのhrefを強制終了することは可能ですか？目標は、以下のような複数のdivに対してグローバル関数を使用できるようにすることです。

これが私のHTMLの構造です。

      <div id="dd" class="mywrap-dropdown-2" tabindex="2">Select
                 <ul class="dropdowner" id="coll-filter">
                      <li><a href="">All</a></li>
                      <li><a href="#">White</li>
                      <li><a href="#">Blue</li>
                 </ul>
        </div> 



     <div id="dd" class="mywrap-dropdown-2" tabindex="2">Select
                 <ul class="dropdowner" id="coll-filter">
                      <li><a href="">Metal</a></li>
                      <li><a href="#">Chrome</li>
                      <li><a href="#">Wood</li>
                 </ul>
        </div>

これについてどうやって行くのかわからない。この関数は、1つだけでなく複数のdiv「#dd」で使用することになっています。

4

1 に答える 1

1

このコードは、最初にクリックされたアンカーclass="selected"の親に追加され、それ以降のすべてのアクションを無効にします。<li>デモ： http： //jsfiddle.net/9Y5x4/2/

$( '#dd' )
    .on( 'click', 'li', function( e )
        {
            e.preventDefault();             
        }
     )
     .on( 'click.runonce', 'li', function( e )
         {
              $( this ).addClass( 'selected' );

             $( '#dd' ).off( 'click.runonce' );
         }
     );

編集：例を更新しました。古いコード： http： //jsfiddle.net/9Y5x4/1/

于 2012-10-15T14:11:14.467 に答える