3

这可能有点令人困惑：S

如果有人可以帮助我将字符串数组拆分为字母。而不是用超时录制它。就像在 DOS 中一样。

我可以用单个字符串做到这一点，但我不能在数组中做到这一点。

这是我的代码：

var text = new Array();
text[0] = "welcome ".split('');
text[1] = "how are u?".split('');
var delay = 20;
for (var j = 0; j < text.length; j++) {

    var txt = text[j];
    for (u = 0; u < txt.length; u++) {
        setTimeout(function () {
            $('div#console_div').append('<br />' + txt.shift());
        }, delay * j + 100);
    }
}
4

2 回答 2

3

我就是这样做的。使用递归函数代替for循环，该函数使用不同的参数调用自身，具体取决于它在字符串上的位置：

var text = new Array();
text[0] = "welcome ".split('');
text[1] = "how are you?".split('');
var delay = 400;

function addOneChar(i, j) {
    $('#console_div').append('<br>' + text[i][j]);
    if (j+1<text[i].length) {  // next character in the current string
        setTimeout(function() { addOneChar(i, j+1); }, delay);
    } else if (i+1<text.length) {   // start the next string in the text[] array
        setTimeout(function() { addOneChar(i+1, 0); }, delay);
    } // else quit
}

setTimeout(function() { addOneChar(0,0); });

http://jsfiddle.net/mblase75/tkEDN/

text[]我们可以通过组合成一个字符串并使用.charAt()提取字符来进一步简化这一点：

var text = new Array();
text[0] = "welcome ";
text[1] = "how are you?";
var delay = 400;
var textstr = text.join('');

function addOneChar(i) {
    $('#console_div').append('<br>' + textstr.charAt(i));
    if (i+1<textstr.length) {
        setTimeout(function() { addOneChar(i+1); }, delay);
    } // else quit
}

setTimeout(function() { addOneChar(0); });

http://jsfiddle.net/mblase75/MYtjy/

于 2013-02-08T14:51:50.823 回答
3

您有典型的“循环关闭”问题。看看循环内的 JavaScript 闭包——简单实用的例子。在执行超时回调的那一刻，txt指的是text[1]. 尽管如此，所有超时仍会执行，因此您调用txt.shift()的频率比数组中的元素多。

另一个问题是，任何人都几乎察觉不到任何高达 100 毫秒的延迟，因此您看不到任何增量。更糟糕的是，对于第一个短语，所有超时都同时（几乎）执行，因为jis0并且delay * j + 100将导致100.

您最好逐个处理每个字母，而不是一次创建所有超时（请注意，Blazemonger 的解决方案是相同的，但更容易理解，因为它更干净）。

var text = [...];

function printLetter(phrase_index, letter_index) {
    var word = text[phrase_index];
    if (word) {
        if (letter_index === word.length) {
            printLetter(phrase_index + 1, 0);
        }
        else {
            var letter = word[letter_index];
            if (letter) {
                $('div#console_div').append('<br />' + letter);
                setTimeout(function() {
                    printLetter(phrase_index, letter_index + 1);
                }, 200);
            }
        }
    }
}

printLetter(0, 0);

演示

于 2013-02-08T14:53:49.597 回答