ywork2020.com

Title

インプット要素のボタン型にイベントハンドラーを設定すればスクリプトを制御出来る

input type="button"の概要

input要素のbutton型は、単純なプッシュボタンとして描画され、イベントハンドラー関数 (普通は click イベント) を割り当てることで、 ウェブページのあらゆる場所でカスタム機能を制御するようにプログラムすることができます。

実機サンプル

このサンプルでは、設置したボタンをクリックした時に背景色をグラデーションにします。

サンプルコード

<body>
	<p><input type="button" value="背景色を変える" onclick="evtBGC()"></p>
	<script>
		function evtBGC(){
			document.body.style="background: linear-gradient(#2CF,#6F8,#FEA);";
		}
	</script>
</body>