20140206【JS】イベントハンドラ属性にJSを記述する

お題

プログラム概要

ボタンを用意し、クリックするとテキストボックスに入力された名前を表示させる。

ソース


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>hoge</title>
<script>
function showDialog() {
    	alert('Hello, ' + form.name.value + '!');
}
</script>
</head>
<body>
  <form name="form">
    please input name:
    <input type="text" name="name"/>
    <input type="button" value="click" onclick="showDialog()"/>
  </form>
</body>
</html>

実行結果

入力画面

f:id:mocomei:20140206185341p:plain

clickを押下すると...

f:id:mocomei:20140206185352p:plain