12 点滅するメッセージを表示

フォームの中でメッセージが点滅するよう設定してください。

ファイル名は js12.html  としてください。

サンプル

 : 省略

1: <script language="JavaScript">
2: <!--
3: myFlg = 0;
4:
5: function tenmetu(){
6: if (myFlg == 0){
7:    document.myForm.myMessage.value = "いらっしゃいませ!";
8:    myFlg = 1;
9: } else {
10:   document.myForm.myMessage.value = "";
11:   myFlg = 0;
12: }
13: }
14:
15: // -->
16: </script>

  : 省略

21: <form name="myForm">
22: <input type="text" size="20" name="myMessage">
23: <script language="JavaScript">
24: <!--
25: setInterval("tenmetu()",500);
26: // -->
27: </script>
28: </form>

  : 省略

このサンプルでは、myForm という名前のフォーム内に設置された、
myMessage という名前の テキストボックス 内で、
「いらっしゃいませ!」という文字が点滅して表示されます。

解説

プログラムの流れは setInterval() を使って、 tenmetu() 関数を定期的に実行しています。
tenmetu() が実行されるたび、「いらっしゃいませ!」メッセージを表示する/メッセージを消す を交互に処理しています。

3行目:
myFlg = 0;
「いらっしゃいませ!」メッセージを表示するかしないかのフラグです。
6行目 〜 12行目 で、
このフラグが0の時は、メッセージを表示してフラグを1にする。
このフラグが1の時は、メッセージを消してフラグを0にする。
という処理を行っています。

7行目 と 10行目:
document.myForm.myMessage.value = "いらっしゃいませ!";
document.myForm.myMessage.value = "";
テキストボックスの中身を書き換えています。
myForm と MyMessage は 21行目 22行目 の form タグと input タグの name 属性に書かれているものと合わせます。
.value を足すことで、テキストボックスの中身を書き換える意味になります。

" " は ヌルストリングと呼んでいて、これを文字変数に代入すると、中身がカラになります。
このサンプルでは、テキストボックスの中身に代入してカラにすることで、メッセージを消しています。

6行目:
このサンプルでも if が使われています。
プログラミングにおいては基本的な、なくてはならない命令です。

6: if (myFlg == 0){
7:    document.myForm.myMessage.value = "いらっしゃいませ!";
8:    myFlg = 1;
9: } else {
10:   document.myForm.myMessage.value = "";
11:   myFlg = 0;
12: }
今回は  else 文 を併用しています。

else { ...... }  の { } 内に書かれた処理は、 上の if の条件が 満たされなかった時に実行されます。