Javascript在此代码之后停止工作

Question

我为类似cmd控制台的打字效果编写了这段代码。代码本身运行良好，但我在它之后放置的任何代码都不起作用。我已经试着想了一段时间了，但我被卡住了。

这是一个关于这个问题的JSFiddle。http://jsfiddle.net/GWj4b/

/**
 * CONSOLE
 */
setInterval(cursorBlink, 500);
function cursorBlink() {
    if($('#cursor').css('visibility') == 'hidden'){
        $('#cursor').css({'visibility': 'visible'});
    } else {
        $('#cursor').css({'visibility': 'hidden'});
    }
}
var text = $('#type').html();
var text = text.replace(/<br>/g, '_');
$('#type').html('');
$.each(text.split(''), function(i, letter) {
    setTimeout(function(){
        if(letter == '_'){
            $('#type').html($('#type').html() + '<br />');
        } else {
            $('#type').html($('#type').html() + letter);
        }
    }, 100 * i);
});

Answer 1

如果您查看控制台日志，您会看到：Uncaught TypeError: Cannot call method 'replace' of undefined

当您对文本调用replace时，它没有被定义，因为您要查找的元素不存在。

你可以测试它是否像这个一样存在

if(text) {
  text.replace(/<br>/g, '_');
}

如果Javascript遇到这样的运行时错误，它将停止执行。

考虑在浏览器中使用Chrome的开发工具或等效工具了解更多关于调试此类问题的信息。一旦你看到错误，就很清楚是哪条线导致了问题。

顺便说一句，在添加了您试图引用的元素之后，代码将通过执行。如果它们可能不存在，那么您需要签入代码，不管怎样，这都是一个好习惯。

http://jsfiddle.net/GWj4b/1/

Answer 2

你不是在用HTML吧？

之后

$('#type')返回undefined，然后执行text.replace(/<br>/g, '_');

您不能执行undefined.replace，因此它失败，并且执行停止。

尝试为JS代码添加html代码

此外，您必须在Frameworks&扩展部分。

看看这把小提琴http://jsfiddle.net/9748L/

Answer 3

我刚刚调试了它，它看起来像是未定义的文本，所以可能您还没有在html中创建元素。

var text = text.replace(/<br>/g, '_');

Answer 4

实际上，您缺少一些html代码，而您试图操作的文本是undefined。您可以添加以下html代码，

<span id="type">is this what you try to do????</span><span id="cursor">_</span>

以达到您想要的效果。

http://jsfiddle.net/JKp5z/