Question

我有一个包含7个链接的网页，我希望能够将其设置为自动点击，然后永久重复切换，点击之间的延迟时间为60秒。我想设置一个按钮来打开/关闭它。当切换时，网页将执行点击操作，当切换关闭时，网页将表现正常。我们的想法是将此功能用于显示目的（显示我们的各种指标等）。

我发现此链接描述了使用setInterval：Calling a function every 60 seconds

这个描述了以编程方式点击链接：How do I programmatically click a link with javascript? ，但是没有能够找到这两种方法结合的任何例子。

尝试：

function click_links(){
    $("safety").trigger("click");
}

window.setInterval(function(){

      click_links();
}, 2000);

并致电：

onclick="click_links();"

但是，到目前为止，甚至无法触发点击事件。

ATTEMPT 2：我接近这个：

function links() {
safety
daily
monday
tuesday
}

var intervalId;
function toggleIntervalb() {

  if (!intervalId) {
    intervalId = setTimeout(links, 5000); 
  } else {
    clearInterval(intervalId);
    intervalId = null;
  }
}

function safety(){
document.getElementById("fires").style.display = 'none';
document.getElementById("safety").style.display = 'block';
document.getElementById("daily").style.display = 'none';
document.getElementById("monday").style.display = 'none';
document.getElementById("tuesday").style.display = 'none';

}
function daily(){
document.getElementById("fires").style.display = 'none';
document.getElementById("safety").style.display = 'none';
document.getElementById("daily").style.display = 'block';
document.getElementById("monday").style.display = 'none';
document.getElementById("tuesday").style.display = 'none';

}
function monday(){
document.getElementById("fires").style.display = 'none';
document.getElementById("safety").style.display = 'none';
document.getElementById("daily").style.display = 'none';
document.getElementById("monday").style.display = 'block';
document.getElementById("tuesday").style.display = 'none';

function tuesday(){
document.getElementById("fires").style.display = 'none';
document.getElementById("safety").style.display = 'none';
document.getElementById("daily").style.display = 'none';
document.getElementById("monday").style.display = 'none';
document.getElementById("tuesday").style.display = 'block';

但是，在5秒之后，它只是执行集合中的最后一个函数（星期二），并且不会在每个函数之间延迟迭代它们。

Answer 1

How do I programmatically click a link with javascript?中的答案不再准确;现在，脚本启动的点击事件只会触发事件they do not cause the browser to actually follow the links：

注意：手动触发事件不会生成与该事件关联的默认操作。例如，手动触发键事件不会导致该字母出现在焦点文本输入中。对于UI事件，出于安全原因这很重要，因为它可以防止脚本模拟与浏览器本身交互的用户操作。

该文档适用于键盘事件，但同样适用于点击事件，如下所示：

＆＃13;

$('#foo').on("click", function() {
 console.log("Click event fired");
});

$('#test').on("click",function() {
  $('#foo').trigger('click');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
   This will work: <a id="foo" href="https://example.com">Example link</a><br>

   This will fire the event but not follow the link: <button id="test">Trigger "click" event on link</button>

＆＃13;

相反，您需要阅读每个链接的href和重定向：

＆＃13;

$('#test').on("click",function() {
  var url = $('#foo').attr("href");
  window.location = url;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="foo" href="https://example.com">Example link</a><br>

<button id="test">Redirect to HREF from link</button>

＆＃13;

（对于您想要的循环行为，当然，您需要将这些链接定位到iframe或单独的窗口;否则，只要用户被重定向到第一个链接，您的代码就会停止运行。）

自动点击网页上的链接以供显示

1 个答案: