prototype.js:フォームのエレメントの値を手軽に読み込む

 prototype.jsにはフォームのエレメント(テキストフィールド等)の値(valueプロパティ)を読み込むためのショートカット関数が用意されています。$F(id名)とすることで、指定されたID名を持つエレメントの値を読み出します。name属性で指定されたものは読み出せません。
 以下のサンプルはテキストフィールドの値を読み出してページ上に表示するものです。(サンプルを実行する

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>prototype.jsサンプル</title>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript"><!--
function loadFormData()
{
$("result").innerHTML = "年齢は"+$F("age")+"です";
}
// --></script>
</head>
<body>
<h1>prototype.jsサンプル</h1>
<form>
年齢:<input type="text" value="23" id="age">
<input type="button" value="チェック" onClick="loadFormData()">
</form>
<div id="result"></div>
</body>
</html>


[目次へ]

(2006.3.22)