-2

jQueryを使用せずにJavaScriptでボタンがクリックされたときに関数を実行するためのベストプラクティスは何ですか?

次のようなソリューションを探しています。

var button = document.getElementById('myButton');

function sayHello() {
    alert('hello');
}

button.attachFunctionToClick(sayHello);
4

4 に答える 4

1

イベントを添付する標準的な方法は次のとおりです。

var button = document.getElementById("myButton");
button.addEventListener("click", sayHello, false);

続きを読む

古いバージョンの ie (9 未満) は addeventlistener をサポートしていないため、 attachEvent 関数にフォールバックする必要があります。

button.attachEvent('click',sayHello);

もちろん、次onclickのように要素のメソッドに追加することもできます。

button.onclick = sayHello

上記の 3 つの例では、コールバック関数にパラメーターを渡さないことを前提としています。つまり、受け取る引数はイベント オブジェクトだけです。

于 2013-04-11T00:30:20.023 に答える
0

ブラウザーのコンプライアンスのために、単純なヘルパー関数を次に示します。

function setEvent (element, event, handler) {
  if(document.addEventListener){
    element.addEventListener(event, handler);
   }else{
      element.attachEvent("on" + event, handler, false);
   }
};

重要:"on" + eventここに注意してください。IE のイベントに使用されます。詳しくはこちらをご覧ください。

例

またはあなたが試すことができます：

button.onclick = sayHello;

これは基本的に DOM 0 の一部であったため、この方法は非常に広くサポートされており、特別なクロスブラウザー コードは必要ありません。したがって、addEventListener() の追加機能が必要でない限り、通常はイベント リスナーを動的に登録するために使用されます。

例

attachEvent - IE < 9 で使用:

オブジェクトでイベントが発生するたびに関数が呼び出されるように、指定された関数をイベントにバインドします。

addEventListener :

addEventListener() は、単一のターゲットに単一のイベント リスナーを登録します。イベント ターゲットは、ドキュメント内の 1 つの要素、ドキュメント自体、ウィンドウ、または XMLHttpRequest の場合があります。

ターゲットに複数のイベント リスナーを登録するには、同じターゲットに対して addEventListener() を呼び出しますが、イベント タイプ、イベント リスナー、またはキャプチャ パラメータは異なります。

于 2013-04-11T00:34:57.100 に答える
0 
var button = document.getElementById('myButton');
function sayHello() {
    alert('hello');
}

if(document.addEventListener)
    button.addEventListener('click',sayHello,false);
else
    button.attachEvent('click',sayHello);
于 2013-04-11T00:31:11.177 に答える
0 
<script>
    function test() {
        alert('aaa');
    }
</script>

<input type="button" onclick="test()" />

また

<input type="button" id="myButton" />

これは、ページの最後で body タグを閉じる前に配置されます。

<script>
    function test() {
        alert('aaa');
    }
    var button = document.getElementById('myButton');
    button.onclick = test;
</script>
于 2013-04-11T00:31:19.380 に答える