リアルタイム JavaScript では入力したJavaScriptをその場で実行できます。
例えば alert("OK"); と入力して「実行ページの作成」ボタンをクリックすると、
「実行」ボタンが現れます。
この「実行ボタン」が alert("OK") を呼び出すように作られています。
※ 作成される HTML は以下のようになります。
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=EUC-JP">
<title>JavaScriptをその場で実行する</title>
<style>
* {
font-size:16px;
}
</style>
<script type="text/javascript" src="http://www.google.com/jsapi" charset="utf-8"></script>
<script type="text/javascript">
google.load("prototype", "1.6.1.0");
</script>
<script type="text/javascript">
function parent_checge() {
var height = document.body.scrollHeight;
parent.document.getElementsByName("tool_js_frame")[0].style.height = ((height+100) + "px");
}
if (window.attachEvent){
window.attachEvent('onload', parent_checge);
}
else {
window.addEventListener('load', parent_checge, false);
}
</script>
</head>
<body>
<script type="text/javascript">
function scriptTest(evt) {
alert("OK");
}
</script>
<input type="button" value="実行" onclick='scriptTest(event);'>
</body>
</html>
この中に記述されている「ボタンをクリック」に関係する部分は以下の部分です。
<script type="text/javascript">
function scriptTest(evt) {
alert("OK");
}
</script>
<input type="button" value="実行" onclick='scriptTest(event);'>
処理される順序
1) ボタンがクリックされる
2) onclick というイベントが発生する
3) イベントに登録されていた処理が呼び出される
※ この場合は、scriptTest(event);
4) scriptTest という function が event というオブジェクトを
引数として与えられて実行が開始される
5) scriptTest という function の内部が実行される
※ この場合は alert("OK");
print "文字列"; print は 関数では無く、「言語構造」だそうです。echo という関数がありますが、 日本人はそもそも、echo ってなじみが薄いので、print でどうぞ。
2) onsubmit='return checkForm(this)'
return は、checkForm でチェックされた結果を受け取る為に必要です。ブラウザ
は、こうしておくと checkForm から return された内容を見る事ができます
checkForm は、自由に作成できる「チェック機構」を持つ部屋です。
旅する文字列を全てチェックできるように、FORM 自身を示す、this を引き渡しています。
3) 問題があれば return false;
return は、それを実行してしまうと、この「チェック機構」を持つ部屋をすぐ
出てしまいます。後に続くチェックの係の窓口に並ぶ事はありません。
ただ、作法として、どこがまずかったかブラウザに知らせる為に、focus と
Firebug 等の開発ツール( IE / Google Chrome デベロッパーツール ) では以下のコードをコンソールに貼り付けて実行すると一覧を取得できます
