Question

我有一个简单的3页演示站点，希望尝试以与Microsoft Powerpoint演示文稿类似的方式显示。

因此，当用户手动单击主页上的“开始”链接时，他们将移至页面2，该页面包含“ 4”（秒）页面上的值，此值将插入页面的setInterval函数中，然后4秒钟后自动单击页面上的“下一步”链接，将用户带到页面3。然后，页面3在“ 6”秒后循环回到首页（因为该值再次插入页面内的setInterval函数中）

这是setInterval计时器代码：

setInterval(function () {
    document.querySelector(".o-controls".click();
}, 3000)

这是3页的代码：

<!--Homepage-->
<html lang="en">

<head>
</head>

<body>
  <section id="start">
    <p>Click "Start" manually to start a Powerpoint style on pages 2 and 3</p>
    <a href="/page2.html">Start</a>
  </section>
</body>

</html>

<!--Page 2-->
<html lang="en">

<head>
</head>

<body>
  <section id="page2">
    <div class="wrapper">
      <p>Javascript function clicks "Next" link after value in seconds below:</p>
      <p id="secondsValue">4</p>
    </div>
    <a class="nextPage" href="/page3.html">Next</a>
  </section>
  <!-- Insert the #secondsValue into the setInterval function, rather than it's current static 4000 value-->
  setInterval(function () {
    document.querySelector("a.nextPage".click();
}, 4000)
</body>

</html>

<!--Page 3-->
<html lang="en">

<head>
</head>

<body>
  <section id="page2">
    <div class="wrapper">
      <p>Javascript function clicks "Next" link after value in seconds below. This then loops you back to the Homepage.</p>
      <p id="secondsValue">6</p>
    </div>
    <a class="nextPage" href="/homepage.html">Next</a>
  </section>
  <!-- Insert the #secondsValue into the setInterval function, rather than it's current static 6000 value-->
  setInterval(function () {
    document.querySelector("a.nextPage".click();
}, 6000)
</body>

</html>

如何将存储在页面元素中的秒值插入setInterval函数？

Answer 1

使用querySelector和.innerText来获取值，并使用parseInt()将其转换为整数，然后乘以：

var seconds = parseInt(document.querySelector("#secondsValue").innerText)*1000;      
 setInterval(function () {
document.querySelector("a.nextPage").click();

}, seconds)

在x秒后使用setInterval以编程方式单击href链接

1 个答案: