3

奇妙な問題があります。最初は .on() メソッドをまったく動作させることができず、使用したくなかったので、.live() を使用しました。

今、私は新しい jQuery スクリプトを書いています。今まで。

jQuery コード:

   $('#artistList a').on('click',function(e){
    console.log($(this).parent().text());
    e.preventDefault();
   });

HTML コード:

<div id="artistList">
 <div class="artist"><a class="delete" href="#"></a>Psy</div>
 <div class="artist"><a class="delete" href="#"></a>Fernanda Martins</div>
 <div class="artist"><a class="delete" href="#"></a>DJ Nreal</div>
</div>

この方法も試しました：

   $('#artistList>a').on('click',function(e){
   $('.delete').on('click',function(e){

運がない。私は何が欠けていますか？

これは機能しない唯一の部分です

.on() に関するドキュメントを読みましたが、それに基づいて、これは機能するはずです。また、最新の jQuery (jquery-1.8.3.min.js) を使用しています。

編集

<a>要素には CSS のwidth: 15pxandheight: 15pxがあるため、それらは表示されます。

4

2 に答える 2

7

liveハンドラーをより高いレベルの要素に委譲する必要があるように機能するには。

 $('body').on('click','#artistlist a', function(e) {
     // note the change to the selector to reflect your actual mark up
     // handler body
 });

ページが最初にロードされた後にハンドラーが適用される要素が動的に追加される場合、この形式のonを使用する必要があります。body 要素の末尾の直前にスクリプトを配置するか、readyイベント ハンドラーを使用して、DOM が読み込まれた後にハンドラーを適用する必要があることにも注意してください。$(function() { ... });

ハンドラーが機能する場合と機能しない場合がある場合は、ページの読み込み時に、DOM に読み込まれる要素と呼び出されるスクリプトとの間で競合状態が発生している可能性があります。これは通常、ready イベント ハンドラー内にハンドラーを追加していないことを示しています。

于 2012-12-24T00:31:28.097 に答える
3

ここではリンク (<a>要素) が空であるため、明らかにclickイベントをキャッチできません。などを 内Psyに移動するのを忘れたと思います。Fernanda Martins <a href="..."></a>

また、実際にこれらのリンクを収集するのは 2 番目のセレクターだけです (すべてのリンクにクラスdeleteがあるため)。最初のもの - - idを持つ要素の直接の子孫である'#artistList>a'アンカーを見つけようとします。しかし、彼らを隔てる別のレイヤーがあるため、この高貴なクエストは失敗する運命にあります- . したがって、ルールはおそらく次のようになります。artistList<div class="artist">'#artistList a'

于 2012-12-24T00:13:02.357 に答える