HTML ボタンから JavaScript 関数をトリガーするにはどうすればよいですか?

HTML ボタンを使用して JavaScript 関数を呼び出す方法

JavaScript コードとインターフェイスするには、HTML ボタンが便利なソリューションです。ボタンがクリックされると、ブラウザは関連付けられた JavaScript 関数を実行します。

HTML 定義のイベント処理

1 つの方法は、HTML コード内で関数呼び出しを直接指定することです。 :

<input type="button" value="Capacity Chart" onclick="CapacityChart();">

DOM イベント プロパティ操作

または、JavaScript を使用してイベント ハンドラーを DOM プロパティに割り当てることもできます。

document.getElementById("clickMe").onclick = function () { /* ... */ };

イベント リスナー アタッチメント

別オプションはイベントに関数を付加することですリスナー:

var el = document.getElementById("clickMe");
el.addEventListener("click", function () { /* ... */ }, false);

ボタン呼び出しのトラブルシューティング

ボタン イベント呼び出しをデバッグするときは、次の点を考慮してください:

• CapacityChart() 関数を確認します。正しく定義されています。
• スクリプト内のエラーを確認してください
• document.write() 行を次のように変更することを検討してください。

CapacityWindow.document.open("text/html");
CapacityWindow.document.write(s);
CapacityWindow.document.close();

ブラウザ間の互換性

複数をサポートするにはブラウザでは、document.all 参照を次のように置き換えます。 document.getElementById.

追加メモ

• 前述の 3 つのイベント処理メソッドは相互に排他的ではありません。
• 最初のメソッドは推奨されません。 XHTML に準拠していません。
• 2 番目と 3 番目のメソッドでは、匿名関数とpost-element-parsing イベント定義。
• 3 番目の方法では、複数の関数を同じイベント ハンドラーにアタッチできます。

以上がHTML ボタンから JavaScript 関数をトリガーするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。