window.clearTimeout( timeoutID )は、window.setTimeout( func, delayTime )メソッドで設定した遅延実行(タイマー)を中止するメソッド。
構文
<script type="text/javascript">
window.clearTimeout( timeoutID );
</script>
window.clearTimeout( timeoutID );
</script>
<script>~</script>
内であれば、window.
は、下記のように省略可能。
<script type="text/javascript">
clearTimeout( timeoutID );
</script>
clearTimeout( timeoutID );
</script>
引数
- timeoutID
- 中止したい遅延実行(タイマー)のID。
戻り値
なし。
サンプル
カウント:
サンプルの動作について
- 「スタート」ボタンをクリックすると、1秒毎に、「カウント: 」の右横の数値を表示し、0からカウントアップしていく。
- 「ストップ」ボタンをクリックすると、カウントアップを停止する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
var $timeoutID;
var $count = 0;
function sampleSetTimeout() {
document.getElementById( "sampleOutput" ).innerHTML = $count++;
$timeoutID = window.setTimeout(
"sampleSetTimeout()",
1000
);
}
function sampleClearTimeout() {
window.clearTimeout( $timeoutID );
}
</script>
var $timeoutID;
var $count = 0;
function sampleSetTimeout() {
document.getElementById( "sampleOutput" ).innerHTML = $count++;
$timeoutID = window.setTimeout(
"sampleSetTimeout()",
1000
);
}
function sampleClearTimeout() {
window.clearTimeout( $timeoutID );
}
</script>
HTML
<div class="sample">
<button onclick="sampleSetTimeout()">スタート</button>
<button onclick="sampleClearTimeout()">ストップ</button>
<br /><br />
カウント: <span id="sampleOutput"></span>
</div>
<button onclick="sampleSetTimeout()">スタート</button>
<button onclick="sampleClearTimeout()">ストップ</button>
<br /><br />
カウント: <span id="sampleOutput"></span>
</div>
CSS
<style type="text/css">
.sample button {
font-size: 16px;
}
</style>
.sample button {
font-size: 16px;
}
</style>