javascript - jQuery：コンテナのすべてのテキストノードにmouseupイベントをアタッチする

Question

jQueryを使用するテキストノードを含む、コンテナのすべてのノードに「マウスアップ」イベントをアタッチしたいと思います。それ、どうやったら出来るの？

アップデート：

このようなHTMLフラグメントがある場合：

<p>Some text node <strong>strong text</strong> another text node.</p>

現在、$（ "p *"）は、イベントをに適用しますが、<p>別々<strong>に内の2つのテキストノードには適用しません<p>。ソースを変更してクラスを追加することはできません。

score 3 · Accepted Answer

bobinceは、テキストノードにイベントハンドラーを設定できないということは正しいです。あなたは次のようなものが欲しいようです

<p><span>Some text node</span> <strong>strong text</strong><span> another text node.</span></p>

イベントはスパンタグに添付されます。ただし、ソースを変更できない場合は機能しません。

score 2 · Accepted Answer

Tatuの答えは機能するはずですが（.clickの代わりに.mouseupを使用することを除いて）、実際にすべてのノードでイベントハンドラーが必要ですか？を使用してバインドする場合

$('#container').mouseup(function(event){//code})

イベントバブリングモデルは、＃container内の任意の要素でmouseupイベントが発生するたびに同じ関数を呼び出し、実際にイベントをトリガーしたDOMノードはevent.targetプロパティに含まれます。ほとんどの場合、これははるかに効率的です。

score 1 · Accepted Answer

Textノードにイベントハンドラーを設定することはできません。テキストノードは、ノードのようにEventTargetインターフェイスを実装しません。ノードとオブジェクトは、実装します。ElementDocumentwindow

あなたもそうする必要はありません。mouseup親要素に1つのハンドラーを設定するとmouseup、そのすべての子コンテンツのイベントが取得されます。これは、mouseupイベントがその祖先を介して「バブル」するためです。

score 1 · Accepted Answer

$('#container *').mouseup(function() { ... });

これにより、mouseupイベントハンドラーが#container内のすべてのノードにバインドされます。

編集

クリック->マウスアップをより明確に変更しました。

score 0 · Accepted Answer

最も簡単なのは、すべてのノードにクラスを追加することだと思います。jqueryセレクターは次のように単純になります：$（'。yourClassName'）。dostuff（）

5 に答える 5