ひとつのボタンでタイマーを動かしたり止めたりしたいのですが

質問

ひとつのボタンでタイマーを動かしたり止めたりしたいのですが

こんにちは
趣味でjavascriptをしているものです

以下のサイトから、テトリスのコードをダウンロードしたのですが、

http://java.aimary.com/

このjavascriptの動くhtml内に　
gameInterval(ゲーム内のタイマー変数）を
使って、ポーズボタンのようなものを追加したいと思ったのですが、
以下のコードのようにすると、いったん停止したとおもったら、
再びタイマーが呼び出され、何度も押すと、タイムインターバルが
短くなっていきました。

//headに追加

function clear_timer()
{

var obj = document.getElementById("timer_control");

clearInterval( gameInterval );

obj.detachEvent('onclick', clear_timer);
obj.attachEvent('onclick', set_timer );
}

function set_timer()
{
var obj = document.getElementById("timer_control");
obj.detachEvent('onclick', set_timer );
obj.detachEvent('onclick', clear_timer );

gameInterval = window.setInterval("Handle_Interval()",
(maxspeed-speed+1)*60);

obj.attachEvent( 'onclick', clear_timer );
}

//bodyに追加

<div style='position:absolute; left:520px; top:100px;'>
<form name='Form1'>
<input type="button" id="timer_control" value="pause"
onclick="JavaScript:clear_timer();">
</form>
</div>

おそれいりますが、どなたか、正しい記述の仕方を
教えていただけないでしょうか？
よろしくおねがいします。

回答No.1

babu_baboo · ベストアンサー

<input type="button" id="timer_control" value="pause" onclick="JavaScript:clear_timer();">
クリックするたびに、とくていのかんすうが１つよばれればよいので toggleTimer とでもしようか。
onclick="JavaScript:clear_timer();"
の、「JavaScript:」は、らべるにしかならないので、ひつようなし。
<input type="button" id="timer_control" value="pause" onclick="toggleTimer();">

clear_timer() と、set_timer()を、１つにし toggleTimer() にする
この２つのなかで、clickいべんとをつけたりはずしたりするのも、ひつようなし。
（inputようその、onclick でよばれるのだから、むよう）

gameInterval = window.setInterval("Handle_Interval()",(maxspeed-speed+1)*60);
ここで、変数 gameInterval、maxspeed、speed はぐろーばるへんすうで
（どこからでもへんこうできる）
たいまーくりあーするときに、へんすう gameInterval もくりあーしておくと
それをきじゅんに、たいまーがどうさちゅうなのか、とまっているのかはんだんできる
setInterval のまえにある、window は、しょうりゃくできるよ
たいまーのひきすうにもじれつをわたすのは、ださ～～い。
"Handle_Interval()" を "Handle_Interval" に。

いじょうをふまえて

function toggleTimer () {
　if (gameInterval) {
　　clearInterval (gameInterval);
　　gameInterval = null;
　}

　else {
　　gameInterval = setInterval (Handle_Interval, (maxspeed-speed + 1) * 60);
　}
}

もし、みじかくしたいのなら（やっぱり？）みかくにんだけど
function toggleTimer () {
　gameInterval = gameInterval ?
　　(clearInterval (gameInterval), null):
　　setInterval (Handle_Interval, (maxspeed-speed + 1) * 60);
}

みじかくなってない？　あぁ～～。
そうそう、ぜんかくくうはくは、はんかくに。これmyおきまりだから ^^;

お礼

よく回答していただきありがとうございます。
以前に回答していただいたもので、できるのか、
とあとになっておもいついたのですが・・・
また、なにか質問させていただいたときはよろしくお願いします。

回答No.2

yyr446

投稿前に、ごはん食べてたら、良い回答がついたみたいだけど、
せっかくだから

<div id=akiko_div>

<INPUT type="button" STYLE="color:#FFFFFF;font-family:Copperplate Gothic light" value="やりなおす"
onclick="javascript:location.reload(true)">
<input type="button" onclick="pause();" value="PAUSE">
</div>
<script type="text/javascript">
function flip(init){
var respons=init;
return function(){
respons = !respons;
return respons;
}
}
var pause_flg=flip(false);

function pause(){
if('undefined' != typeof gameInterval){
if(pause_flg())
clearInterval(gameInterval);
else
gameInterval=window.setInterval("Handle_Interval()",(maxspeed-speed+1)*60);
}
}
</script>
</body>

お礼

二度目の回答をしていただき、ありがとうございます。
no.1さんに以前教えていただいた方法を後から
思い出してしまいました。
お手間をとらせてしまって申し訳ありません
貴重な時間をさいての回答、ありがとうございました。