今日はOnclickについて勉強していこうと思います。
ボタン(htmlのINPUTタグ)がクリックされた時にJavaScriptを実行したい
場合があります。
INPUTタグのOnClick属性にJavaScriptを記述することで、ボタンクリック時にJavaScriptを実行する事が可能になります。
実際にコードを書いていきます。
<head>
<meta charset="utf-8">
<title>onclick</title>
<script language="javascript" type="text/javascript">
function OnButtonClick() {
target = document.getElementById("output");
target.innerHTML = "修行";
}
</script>
</head>
<body>
<input type="button" value="男は" onclick="OnButtonClick();"/><br />
<br />
<div id="output"></div>
</body>
</html>
このボタンをクリックすると、
上に書かれたコードを解説していきます。
"output"のIDを持つdivを作り、そのタグの内部のテキストに"修行"の文字列を挿入します。
INPUTのonclick属性に実行したいJavaScriptを記述します。
今回の場合、呼び出す関数名のみを記述したため、ボタンが押されるとOnButtonClick()関数が実行される動作となります。
そこで、functionにより関数を定義しています。
<input type="button" value="サブウィンドウを閉じる" onClick="window.close()">
あるいは
<a href="javascript:;" onclick="window.close();">
このように記述する事でウィンドウを閉じる事が出来ます。
以上
