- ベストアンサー
setTimeout()がうまくいきません
以前、時計を一秒一秒、新しい絵を読み込んで バー表示型の時計を作ろうとしていた者ですが なんとか、１つの画像を連続表示させて 一本のバーにしていくスクリプトを 下記のように作りました そうしたところ、手動で更新をすると、うまく動作するのですが 自動で更新していこうと思いsetTimeout()を入れたのですが うまく動作してくれません。どのようにしたらよいのでしょうか <html> <head> <script language="JavaScript1.1"> <!-- function timesec() { var now = new Date() var s = now.getSeconds() var x = 60-s for(gj=0;gj<x;gj++) { var no = gj+1*x document.write("<img src='sec_1.gif' NAME='Name"+no+"'>") } } //--> </script> </head> <body> <script language="JavaScript1.1"> <!-- timesec() ----> </script> </body> </html>
- ToolBox
- お礼率27% (3/11)
- JavaScript
- 回答数10
- ありがとう数3
- みんなの回答 （10）
- 専門家の回答
質問者が選んだベストアンサー
＞現時刻秒数ぶんの長さのバー リアルタイムに出すの？ <html> <head> <script language="JavaScript"> <!-- var pp; var gj=0; function timesec(){ var now = new Date(); var s = now.getSeconds(); var x = s; var no; if(gj<60){ no = gj+1*x; pp.innerHTML += "<img src='sec_1.gif' NAME='Name" + no + "'>"; gj++; setTimeout("timesec()",1000); return; } pp.innerHTML =""; gj=0; setTimeout("timesec()",1000); } function window_onload() { pp = document.getElementById("pp"); var now = new Date(); var s = now.getSeconds(); var x = s; var no; //最初に現在秒数を表示してしまう。 for(i=0;i<x;i++) pp.innerHTML += "<img src='sec_1.gif' NAME='Name" + no + "'>"; gj=x; timesec(); } //--> </SCRIPT> </head> <body LANGUAGE=javascript onload="return window_onload()"> <P id=pp></p> </body> </html> 間に合うかな？
その他の回答 (9)
- ittochan
- ベストアンサー率64% (2667/4137)
ε- (^、^; ふぅ 間に合ったみたいですね。 ちょっと手直ししました。 <html> <head> <script language="JavaScript"> <!-- var pp; var gj,x,s,no; function timesec(){ var now = new Date(); s = now.getSeconds(); x = 60-s; if(gj<60){ no = gj; pp.innerHTML += "<img src='sec_1.gif' NAME='Name" + no + "'>"; gj++; }else{ pp.innerHTML =""; gj=0; } setTimeout("timesec()",1000); } function window_onload() { pp = document.getElementById("pp"); var now = new Date(); s = now.getSeconds(); x = 60-s; //最初に現在秒数、画像を表示してしまう。 for(gj=0;gj<s;gj++) no = gj; pp.innerHTML += "<img src='sec_1.gif' NAME='Name" + no + "'>"; timesec(); } //--> </SCRIPT> </head> <body LANGUAGE=javascript onload="return window_onload()"> <P id=pp></p> </body> </html> no = gj+1*x; ここを no = gj; にしたけどよかったのかな？
- ittochan
- ベストアンサー率64% (2667/4137)
var now = new Date(); var s = now.getSeconds(); var x = 60-s; を function timesec() の外に出せばいいと思います var pp; var gj=0; function timesec_(){ ↓ var pp; var gj=0; var now = new Date(); var s = now.getSeconds(); var x = 60-s; var no; function timesec_(){ こう？
補足
お返事が遅れ、申し訳ありません どうも、ありがとうございました やはり、現時刻秒数ぶんの長さのバーを表示させるのは 難しいようです 地道に自分で考えていこうと思います
- ittochan
- ベストアンサー率64% (2667/4137)
＞なんとか、現秒数をうまく反映できないでしょうか もうちょっと詳しく説明してもらえますか？
補足
えっと、getSeconds()で取得した秒数を バーの長さで表したいと思っているのです それを、毎秒更新でバーを伸ばしていきたいと 思ったのです。
- ittochan
- ベストアンサー率64% (2667/4137)
これはどうでしょう。 違う？ <html> <head> <script language="JavaScript"> <!-- var pp; var gj=0; function timesec_(){ var now = new Date(); var s = now.getSeconds(); var x = 60-s; var no; if(gj<x){ no = gj+1*x; pp.innerHTML += "<img src='sec_1.gif' NAME='Name" + no + "'>"; gj++; setTimeout("timesec_()",1000); } } function window_onload() { pp = document.getElementById("pp"); timesec_(); } //--> </SCRIPT> </head> <body LANGUAGE=javascript onload="return window_onload()"> <P id=pp></p> </body> </html>
お礼
どうもありがとうございました これを参考に現在時刻の秒数表示 ができるようにしていきたいとおもいます。 勉強になりました。
補足
一度、お礼を書き込んでしまったのですが 自分で、なんとか昇華させようと思ったのですが どうも、うまくいかないです。 なんとか、現秒数をうまく反映できないでしょうか 本当に、お暇な時で構いません。
- ittochan
- ベストアンサー率64% (2667/4137)
むむ？ ＞＞行が増えていっているの？ ToolBoxさんとしてはそれでＯＫなんですね？ ＞１つの画像を連続表示させて一本のバーにしていく ちょっと待っててね。
- ittochan
- ベストアンサー率64% (2667/4137)
<body> <P id=pp></P> として document.write("<img src='sec_1.gif' NAME='Name"+no+"'>") ここを pp.innerHTML = "<img src='sec_1.gif' NAME='Name"+no+"'>"; こんな感じにするといいです。（IE専用） NN7（６？）では var pp = document.getElementById("pp"); これが必要です。
- mirurin
- ベストアンサー率43% (48/111)
setTimeout()でtimesec()を1秒間隔で呼び出したとしても、 一度目の呼び出しはできても二度目でエラーになるはずです。 なぜかというと、 一度目の呼び出しのときに、document.writeで新しいページ として書き込まれ（つまり、ページのソースがimgタグだけ） になっちゃうからです。 画像を２種類用意し、はじめから60個並べといて 関数が呼び出されたときに画像を入れ替えるとか、 そんなふうなやり方に変えたほうがいいような気がします。
- ittochan
- ベストアンサー率64% (2667/4137)
なんとなくなんですけど、 timesec() が呼び出される度に document.write("<img src='sec_1.gif' NAME='Name"+no+"'>") が実行されて 行が増えていっているの？ こういうのは innerHTML 使うといいと思うけど
- ittochan
- ベストアンサー率64% (2667/4137)
＞setTimeout()を入れたのですが それも書いてね。
補足
スミマセンでした。 var no = gj+1*x document.write("<img src='sec_1.gif' NAME='Name"+no+"'>") } setTimeout("timesec()",1000) } //--> </script> と入れてみましたが、うまくいきませんでした
お礼
返事が遅くなり、申し訳ございません イロイロとありがとうございました 最初に現在の秒数を読み込んで 後は一秒ごとの更新でカウントしているのですね 自分では、毎回、現在の秒数を読み込もうとしていました。 そうすると、現在の分数や時数もできると思ったので でも、このやりかたでも、更新秒数を分単位にしたり 時単位にすることで、できそうですね。 重ね重ね、ありがとうございました