Question

上找到了以下功能

使用Javascript：

      <script type='text/javascript'>
           var showText = function (target, message, index, interval) {
           if (index < message.length) {
                $(target).append(message[index++]);
                     setTimeout(function () { showText(target, message, index, interval); }, interval);
                }
           }
      </script>

HTML：

<span class='console' id='white' color='white'></span>
 <script type="text/javascript">
 $(function () {
      showText('#white', 'Text<br>blah<br>', 0, 50);
 });
 </script>

或多或少是如何运作的。我想做同样的事，但允许多行。它不会渲染<br>标记，而是将它们写出来。

1。为什么这样处理？

2。我怎样才能得到预期的结果？

注意：我根本没有使用Javascript的经验，并对这是一个简单问题的可能性表示道歉。

- 编辑 -

JSFiddle：http://jsfiddle.net/Ls6mW/

Answer 1

每个字符都被视为字面值，因为它存储在字符串中并逐字逐句。
我不确定为什么\n和\r不起作用，所以我写了一些关于这将允许\n工作的工作。
< / LI>
基本上，检查打印时通过字符串的每个字符。如果是换行符，请插入一个中断：
```
if(message[index]=='\n'){
  $(target).append("<br />");
}
```
然后在文字中的换行符中添加\n：
```
showText("#msg", "H\ne\nl\nl\no\n,\n \nW\no\nr\nl\nd\n!", 0, 50);    
```
这只是一种快速修复，解决方法类型的事情。我很想知道是否有一个实际的原因，换行不适用于此。

这是一个工作版本： http://jsfiddle.net/VZvK7/192/

Answer 2

1。 <br>标记实际上被解释为字符串，而不是html内容，因为您的函数通过索引访问字符串的每个字符的方式。同样，如果您使用/n，则会发生这种情况。

2。您需要通过单个字符或其他方式捕获特殊情况。以下是捕获单个特殊字符的示例，在本例中为＆符号（&）并将其解释为换行符：

 $(function () {
      showText('#white', 'Text&blah&thirdline&fourthline', 0, 50);
 });

function showText (target, message, index, interval) {
    if (index < message.length) {
        var next = message[index++];
        if (next == '&') {
            $(target).append('<br>');  
        } else {
            $(target).append(next);
        }
        setTimeout(function () { showText(target, message, index, interval); }, interval);
    }
}

这是working fiddle。

您可能需要考虑捕获整个字符串（即整个<br>），但这只是一个可能解决方案的示例。

慢慢打印文本，并解释html

1。为什么这样处理？

2。我怎样才能得到预期的结果？

2 个答案: