9

私が取り組んでいる最新のプロジェクトで、クラス名に従ってイベントハンドラーを定義しました。

例のために。クラス名「foo」を持つすべての要素は、変更イベントで特定の方法で応答する必要があります。クラス名が「bar」のすべての要素は、別の方法で応答する必要があります。

現在、私の要素の一部は両方のクラス、つまり class="foo bar" に該当し、両方の方法で応答する必要があります。現在、イベント ハンドラ関数の 1 つだけが呼び出されています。

両方の応答を同時に実行するにはどうすればよいですか。

4

2 に答える 2

14

イベントをバインドする方法によって異なります。jQuery を介してそれらをバインドし、ハンドラーを上書きしない場合x.onchange = function() { ... }、バインドされたすべてのイベント ハンドラーが実行されます。これは、jQueryが以前のバインディングを上書きするのではなく、イベント ハンドラーをキューに入れるためです。

fiddleこれをチェックして、複数のイベントが発生
していることを確認 します。

これをチェックしfiddleて、イベント ハンドラーがどのように上書きされ、最後にバインドされたハンドラーのみが起動されるかを確認します。

于 2012-10-02T05:14:01.597 に答える
5

必要なのは、「動作」パターンのバリエーションです。

特定のクラスまたはその他の属性を持つ要素のイベントを自動的に処理できます。

通常の実装では、「ドキュメント」でイベントをリッスンし、次に event.target によってアクションを定義します。

例: フィドル( http://jsfiddle.net/PRkAr/ )

$(document).on('click change', '.foo.bar', function(e) {
  var classes = this.className.split(/\s+/);
  $.each(classes, function(i, cls) {
    handle(e, this, cls);
  })
})

function handle(e, elem, cls) { 
  // example: Event type click on elem DIV with class foo
  alert("Event type " + e.type + " on elem " + elem.tagName + " with class " + cls);
}

ここでは、選択したクラスを持つ要素のすべてのイベントを処理する関数ハンドルを使用します。他のイベントやクラスを追加したい場合は、それらを「on」リストに追加してください。

于 2012-10-02T06:22:57.210 に答える