0

JavaScript クリック リスナーをどこにアタッチするかについてのベスト プラクティスは何だろうと思っています。つまり、イベント リスナーをコンテナに配置するか、個々のボタンに配置するか。

例 html の例:

<div id="content">
    somecontent blah blaoh
    <button class="button1"></button>
    <button class="button2"></button>
    blah blah blah
    <table></table>
    more content...
</div>

1) クリック リスナーを #content に配置すると、その div 内の何かをクリックするとイベントが発生します。そのため、イベント ハンドラーで、クリックされたターゲットのクラスを確認し、正しい動作を実行できます。2) または、イベント リスナーを .button1 と .button2 に直接アタッチする必要がありますか?

メリット・デメリットなどを教えてください。

ありがとう。

4

3 に答える 3

0

ボタンに直接取り付けてください。長所：

  • それははるかに簡単です
  • みんな使ってる
  • クリックされたボタンをチェックする余分なコードを入力する必要はありません
  • しない理由はありません

親にイベントハンドラーを適用する人は誰もいません。私はそうする理由が見当たらず、それを実行するコードを見たことがなく、それを実行することも私の頭をよぎったことはありません。

ただし、ちょっとした提案が1つあります。ボタンにイベントハンドラーを追加する方が簡単なため、クラスではなくボタンにIDを設定します。

より具体的な問題がある場合、または親でイベントハンドラーを使用する理由がある場合は、コメントに入れてください。

于 2013-03-12T00:40:47.047 に答える
0

.button1とがクリックされたときに異なるアクションを実行する場合.button2は、各ボタンに個別のイベント ハンドラーを割り当てて、ターゲットを検査する必要がないようにします。いずれかのボタンがクリックされたときに同じアクションを実行する場合は、イベント ハンドラーを に割り当てることができますがdiv、この時点で、なぜ 2 つのボタンがあるのか​​を疑問視する必要があります。

于 2013-03-12T00:34:53.513 に答える
0

私の簡単な答えは次のようになります

<div id="container1" onClick="doAction1()">
  <button id="A" class="buttonA" onClick="doActionA()"></button>
  <button id="B" class="buttonB" onClick="doActionB()"></button>
</div>

すぐに、両方のイベントに同じコモンを発生させる必要がある場合に備えて、ボタン A と B にコンテナーを使用し、それらのローカル イベントを直接設定します。ミックスイン イベントの検査は、少なくとも私にとっては便利ではありません。

于 2013-03-12T01:16:05.487 に答える