6

私は次のhtmlを持っています：

        <ul id="contain">
         <li class="active_one"></li>
         <li class="two"></li>
        </ul>

そして次のjquery：

$contain = $('#contain'); //going to use a lot

$contain.on('click','li.two', function(){
                console.log('working');
                //plus do other stuff
                });

上記は機能しませんが、次のように変更すると次のようになります。

$('body').on('click','li.two', function(){
                    console.log('working');
                    //plus do other stuff
                    });

その後は機能しますが、ベストプラクティスは、作業しようとしているものの親要素にできるだけ近づけることです。それでも、それを実行しようとするたびに、親レベルセレクターが原因で、明らかに間違ったことを実行しています。動作していません。

4

2 に答える 2

17

それ自体は静的要素ではないことを意味します。要素の最も近い静的親を#contain選択する必要があります。そうしないと、jQuery は要素を選択せず​​、委譲は失敗します。

イベント ハンドラーは、現在選択されている要素にのみバインドされます。これらは、コードが .on() を呼び出す時点でページに存在している必要があります。

ただし、要素が静的な場合は、要素を選択するのが早すぎます。DOM の準備が整うまで待つ必要があります。

$(document).ready(function(){
   var $contain = $('#contain'); //going to use a lot
   $contain.on('click','li.two', function(){
       console.log('working');
       //plus do other stuff
   });
})
于 2013-01-04T20:19:41.437 に答える