« javascript はシングルスレッドだそうです。タイマーを使えば一応解決。 | メイン

2018年6月 6日 (水)

マウスクリック無効化(前回の続き)

タイマーを止めたあと、マウスクリックイベントを停止するサンプルです。
onclick に null を代入しています。

----

<!DOCTYPE html>
<html>
<head>
	<title>global test timer</title>
	<meta charset="UTF-8">
	<script>
		"use strict";

	// 広域変数
		var testValue=0,timer;
		var message,addCount;	//

		// 初期化関数
		function init() {
//			alert("init");
			message = document.getElementById("message");
			message.textContent=testValue;

			addCount = document.getElementById("addCount");
//			alert(document.getElementById("addCount"));
//			alert(addCount);
//			alert("init2");


			addCount.onclick=click;

//			alert("start");

			timer = setInterval(tick, 100);
		}

		function tick(){

			if(testValue < 5){
				message.textContent=testValue;
				}else{

				message.textContent="end";
				addCount.onclick=null;

				clearInterval(timer);
			}

		}

		function click(e){
			testValue++;
			alert(testValue);	//debug
		}


	</script>
</head>
<body onload="init()">
	<button id="addCount">click test</button>
		<p id="message"></p>
</body>
</html>

--
http://www3.synapse.ne.jp/wtz/programming/html5/globalTestTimer2.html
----

トラックバック

このページのトラックバックURL:
http://app.synapse-blog.jp/t/trackback/563545/34129473

マウスクリック無効化(前回の続き)を参照しているブログ:

コメント

コメントを投稿