Question

我正在尝试使用typed.js键入文本，但无法正常工作。

<head>
<meta charset="utf-8">
<title>webpage</title>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
<div id="particles-js"></div>
<script type="text/javascript" src= "js/particles.js"></script> 
<script type="text/javascript" src = "js/app.js"></script> 
<script type="text/javascript" src="js/typed.js" ></script>

<div class = "name">
Name
<div class = "about"><p>Developer <span class="typed">| Reader</span></p></div>
</div> 
<script type="text/javascript">
var typed = new Typed(".typed",{
                strings: ["Python Enthusiast","Stopped"],
                backSpeed: 40,
                typeSpeed: 40
              });
</script>

我只希望输入读者文字

Answer 1

当我尝试使用带有cdn脚本标记的代码时，它会键入。您的本地typed.js文件可能存在问题。请参阅下面的代码段以供参考：

<head>
  <meta charset="utf-8">
  <title>webpage</title>
  <link href="style.css" type="text/css" rel="stylesheet">
</head>

<body>
  <div id="particles-js"></div>
  <script type="text/javascript" src="js/particles.js"></script>
  <script type="text/javascript" src="js/app.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.10/typed.min.js"></script>

  <div class="name">
    Name
    <div class="about">
      <p><span class="typed"></span></p>
    </div>
  </div>
  <script type="text/javascript">
    var typed = new Typed(".typed", {
      strings: [
        "Developer | Reader",
        "Developer | Python Enthusiast",
        "Developer | Stopped"
      ],
      backSpeed: 40,
      typeSpeed: 40
    });
  </script>

编辑：如果要键入所有字符串，则必须将它们添加到字符串数组中。同样，不应更改的部分（在这种情况下，Developer |应该位于每个字符串中），以便typed.js确切知道退格时要擦除多少。它将自动保留所有字符串之间共有的部分。

如果您只想键入|之后的部分，而读取器部分则在加载时已经存在（如您自己的代码一样），请尝试以下操作：

<head>
  <meta charset="utf-8">
  <title>webpage</title>
  <link href="style.css" type="text/css" rel="stylesheet">
</head>

<body>
  <div id="particles-js"></div>
  <script type="text/javascript" src="js/particles.js"></script>
  <script type="text/javascript" src="js/app.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.10/typed.min.js"></script>

  <div class="name">
    Name
    <div class="about">
      <p>Developer | <span class="typed">Reader</span></p>
    </div>
  </div>
  <script type="text/javascript">
    var typed = new Typed(".typed", {
      strings: [
        "Reader",
        "Python Enthusiast",
        "Stopped"
      ],
      backSpeed: 40,
      typeSpeed: 40
    });
  </script>

换句话说，如果您要调用的元素中已经有一些文本出现，则需要在字符串数组中也存在该文本，否则它将跳过某些元素。

甚至没有使用typed.js键入文本

1 个答案: