5

私は、 MDCドキュメントstopPropagationからのコードを適応させて遊んでいます。

ここに質問があります：私が彼らがしたことをして使用すれば、すべてがうまくいきますelement.addEVentListener("click", fname)。
しかし、要素のonclick属性（<div onclick="fname();">）を使用して関数をアタッチしようとすると、伝播が停止しません。
そして、私が使用した場合、fname（）はまったく呼び出されません（私も同じ結果で<div onclick="function(ev) {fname();}">渡そうとしました）。fname(ev)

アイデアは誰ですか？コードを確認する必要がある場合はお知らせください。

4

2 に答える 2

9

実際には、イベントは次のように機能します。

イベントの発火、キャプチャ フェーズ、バブリング フェーズ、イベントにはデフォルト アクションが適用されます。

したがって、伝播を停止するには、次の操作を実行できます。

element1.addEventListener('click',fname,true)  // Capturing phase
element1.addEventListener('click',fname,false) // Bubbling phase

fname(event){
  event.stopPropagation();
//event.preventDefault(); is also available here (in both phases I believe)
}

伝播はバブリング フェーズ中にのみ停止できることに注意してください。この方法でイベント ハンドラを使用する場合にのみ、イベントを中断できます。

私が知る限り、伝統的な方法

<div onclick="return fname();">

はこの機能を許可しません。

于 2011-04-18T14:56:38.813 に答える
8

これを行うとき：

<div onclick="fname();">

fnameイベントハンドラーとして割り当てているのではなく、イベントハンドラー（これはあなたのために作成された無名関数です）内から呼び出しています。 したがって、最初のパラメーターはに渡すものであり、引用符で囲まれたコードでは、何も渡さないことになります。fnamefname

あなたが望むだろう：

<div onclick="fname(event);">

eventただし、自動生成された無名関数が名前を使用してパラメーターを受け入れるeventか、IEまたはIEのようなことを行うブラウザーを使用していて、IEのグローバルを確認していることを前提としているため、それでも信頼できません。window.event財産。

より信頼できる方法は次のとおりです。

<div onclick="return fname();">

...そして、伝播を停止し、ブラウザのデフォルトのアクションを防止したい場合は、fnameリターンがあります。false

 このすべての理由から、イベントで何か面白いことをしたい場合（または、10回のうち9回）、ハンドラーをフックするために、常にDOM2メソッド（IE9より前のIEでは引数が少し異なります）をaddEventListener使用することを強くお勧めします。attachEventそうしなくても）。

オフトピック：そして、この領域全体が、jQuery、Prototype、YUI、Closureなどのライブラリを使用してブラウザの違いをスムーズにし、自分の作業に集中できるようにすることをお勧めする理由の1つです。

于 2011-04-18T14:38:33.327 に答える