Question

我正在使用typed.js插件来输入效果。我有2行，在第一行结束后，我想从第二行开始。这就是我所尝试的，问题是，当它切换到第二行时，您可以看到键入的标签。我不想要这个。请告诉我我做错了什么。我也尝试在回调函数中调用类型函数，但它没有用:(

以下是我的代码

<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="typed.js"></script>
    <title>Typed.js</title>

<style>
   .test {
       font-size: 30px;
   }

    </style>
</head>
<body>
    <span class="box1"></span>
    <span class="box2"></span>

<script>
  $(function(){

        $(".box1").typed({
            strings: ["First sentence.", "<p></p><span class='test'>Second sentence.</span>",""],
            typeSpeed: 0,
            showCursor: false,

        });
    });
    </script>
</body>
</html>

请告诉我我做错了什么

Answer 1

您是否尝试添加contentType属性？

$(".box1").typed({
        strings: ["First sentence.", "<p></p><span class='test'>Second sentence.</span>",""],
        typeSpeed: 0,
        showCursor: false,
        contentType: 'html'
});

Answer 2

可能为时已晚，但我意识到您可以在要显示的字符串中添加\n并使用white-space: pre;和voilà设置键入的元素的样式，它无需显示任何标签即可工作。

因此Javascript代码将如下所示：

  $(function(){

        $(".box1").typed({
            strings: ["First sentence.", "\n<span class='test'>Second sentence.</span>",""],
            typeSpeed: 0,
            showCursor: false,

        });
    });

，CSS为：

.box {
  white-space: pre;
}

它也仅适用于一个字符串。

在多行中键入.js

2 个答案: