0

最後までフラッシュを再起動する必要がないように、このフラッシュを途中でリセットしたいのですが、どうすればリセットできますか?

function flash() {
var arrayId = 0,
    splitSet = $('#text_original').html().split(" "),
    splitSetLength = splitSet.length;


function flashWord() {
    $("#flash_word").html(splitSet[arrayId]);
    arrayId += 1;
    var t = setTimeout(remove, 1000);
}

function remove() {
    if (arrayId < splitSetLength) {
        $("#flash_word").html(" ");
        flashWord();
    } //else reset_flash();
}
flashWord(); }

http://jsfiddle.net/HcDfS/をご覧ください。

4

1 に答える 1

1

タイマー変数をグローバル変数にして、タイムアウトをキャンセルします（を使用してclearTimeout()）。次に、非表示にし#flash_wordます。

私はあなたのフィドルを再実装する自由を取りました：

var timer, words;

function startFlashing() {
    words = $("#source").text().split(" ");
    showNextWord(0);
}

function stopFlashing() {
    clearTimeout(timer);
    $("#banner").text("");
}

function showNextWord(index) {
    $("#banner").text(words[index]);
    index++;
    if (index < words.length) timer = setTimeout(function () {
        showNextWord(index);
    }, 1000);
    else $("#banner").text("");
}

HTMLの場合：

<p id="source">This is the text to be flashed.</p>
<button onclick='startFlashing()'>Start Flashing!</button>
<button onclick='stopFlashing()'>Stop Flashing!</button>
<p id="banner"></p>​

そしてそれはここにあります：http：//jsfiddle.net/CZnVc/6/

于 2012-08-06T18:19:27.273 に答える