SetInterval 方法仅在 onclick 事件上执行一次

Question

我最近在 YouTube 上看到了一个关于如何创建桌面通知的教程，我认为将其用作提醒是个好主意。例如，假设我希望每 30 分钟出现一个特定的提醒（作为桌面通知）。只有在点击触发按钮时才会触发此提醒。问题是，对于我下面的代码，setinterval 方法似乎只执行一次。如果我不包含点击事件，它似乎工作正常，但一旦我添加点击事件，它就无法重复。有什么建议吗？

这是我所拥有的片段：

<a href="#" id="trigger" onclick="notifyme()">Trigger</a>

    <script type="text/javascript">

        var myVar;          
        function showalert(){
                var notify;
                notify = new Notification('Reminder!',{
                        body:'How are you?'
                    });
                    window.location = '?message=' + this.tag;
                }
    function notifyme() {
      myVar = setInterval(showalert, 5000);
}

Answer 1

它只工作一次，因为您使用 window.location = '?message=' + this.tag; 行重定向浏览器，当页面重新加载时，您必须单击锚点才能再次开始间隔

<a href="#" id="trigger" onclick="notifyme()">Trigger</a>

<script type="text/javascript">
  var myVar;

  function showalert() {
    var notify;
    notify = new Notification('Reminder!', {
      body: 'How are you?'
    });

  }

  function notifyme() {
    myVar = setInterval(showalert, 5000);
}

请注意，您通常必须请求许可才能显示通知

function showalert() {
  var notify;
  notify = new Notification('Reminder!', {
    body: 'How are you?'
  });
}

function notifyme() {
  if (Notification.permission === "granted") {
    var myVar = setInterval(showalert, 1000);
  } else {
    Notification.requestPermission(function(permission) {
      if (permission === "granted") {
        var myVar = setInterval(showalert, 1000);
      }
    });
  }
}

<a href="#" id="trigger" onclick="notifyme()">Trigger</a>

SetInterval 方法仅在 onclick 事件上执行一次

SetInterval method executes only once on an onclick event

javascript

notifications

onclick

setinterval