0

live() は推奨されていないため、on() に問題があります。

これはうまくいかないようです：

$('body').on("click", ".myButton", console.log("clicked"));

ページを更新すると、何もクリックしていなくてもコンソールにすぐに「クリックされました」と表示されますが、実際にクリックしても起動しません。

また、BODY の巨大な範囲ではなく、ボタンが含まれる DIV にこれを適用する方がパフォーマンスが向上するように思われます。これは本当ですか？

4

4 に答える 4

3 
$(function(){
    $('body').on("click", ".myButton",function(){
       alert("clicked");
    });
});
于 2012-04-15T17:45:08.340 に答える
2

あなたが見ている奇妙な振る舞いは、あなたが実際console.logにその回線で自分自身を呼んでいるからです。関数でラップする必要があります。

function () { console.log('clicked'); }
于 2012-04-15T17:44:34.513 に答える
2 
$('body').on("click", ".myButton", function() {
     console.log("clicked")
});
于 2012-04-15T17:45:32.350 に答える
2

あなたの質問の最初の部分は、他の回答によって適切に回答されています。console.log()後で呼び出すことができる関数への参照を渡すのではなく、関数を呼び出していました。

他の誰もまだ取り組んでいない質問の 2 番目の部分に答えるには、次のようにします。

はい、使用するよりも、ボタンのより近い祖先にイベント ハンドラーのスコープを設定した方がパフォーマンスが向上します$('body')。

ボタンにできるだけ近いボタンの祖先を選択する必要がありますが、イベント ハンドラーをインストールするときに静的に存在します (後で動的に破棄/作成されません)。

.live()推奨されなくなった主な理由の 1 つ.on()は、.live()すべてのイベント ハンドラーをdocumentオブジェクトに配置することです。ビジー ページでは、オブジェクトに多数の委任されたイベント ハンドラーが存在する可能性がありdocumentます。それが発生すると、単一のイベントがオブジェクトまでバブルし、すべてのdocument単一のイベントを、可能な委任されたイベント ハンドラーの長いリストと比較する必要があります。これは通常、 に対してセレクタ操作を実行することを意味するためeventTarget、これは非常に遅くなる可能性があります。

一方、目的の eventTarget に非常に近い祖先オブジェクトを選択すると、オブジェクトの非常に小さなリストからのイベントの非常に小さなリストがこの特定の委譲されたイベント ハンドラーを通過し、イベント システム全体のパフォーマンスが向上します。 .

多数のイベント/オブジェクトで最高のパフォーマンスを得るには、委任されたイベント ハンドラーをターゲット オブジェクトのできるだけ近くに適用する必要があります。

于 2012-04-15T17:55:00.167 に答える