javascript - 编辑链接的innerText禁用点击链接

Question

在 9 秒不活动后，我的函数将字母“o”替换为一朵花。

当我在链接上使用它时，例如<a href="google.com">Click on me</a>无法单击链接。

这只发生在 Safari 中。我正在使用版本 11.1.2。它适用于 Chrome 和 Firefox。

Safari 有什么不同的做法导致了这个问题？

我发现 wwindow.onmousedown事件监听器是罪魁祸首。在 Safari 中单击链接的能力很混乱。

var elements = document.querySelectorAll('.flowerText');
var functionIsRunning = false;


function elementSelector(x, y) {
  var strNewNew = elements[x].innerText;
  var oneMoreFlower

  function changeToFlowers() {
    if (functionIsRunning) {
      return;

    }
    oneMoreFlower = strNewNew.replace(/o/, "✿");
    elements[x].innerText = oneMoreFlower;
    strNewNew = oneMoreFlower;
    return strNewNew;
  }

  var newVariable = (strNewNew.match(/o/g) || []).length; //logs 3


  function randomIntFromInterval(min, max) { // min and max included 
    return Math.floor(Math.random() * (max - min + 1) + min);
  }

  for (var i = 0; i < newVariable; i++) {
    var int = randomIntFromInterval(0, 1500);

    setTimeout(changeToFlowers, int)
  }

}
var numOfElements = document.querySelectorAll('.flowerText').length;

function changeToOs() {
  if (!functionIsRunning) {
    functionIsRunning = true;
    elements.forEach(function(company) {
      var textContentVar = company.innerText;
      company.innerText = textContentVar.replace(/✿/g, "o");
      return;
    });
    functionIsRunning = false;
  }
}

function idleLogout() {
  var t;
  window.onload = resetTimer;
  window.onmousemove = resetTimer;
  window.onmousedown = resetTimer; // catches touchscreen presses as well      
  window.ontouchstart = resetTimer; // catches touchscreen swipes as well 
  window.onclick = resetTimer; // catches touchpad clicks as well
  window.onkeypress = resetTimer;
  window.addEventListener('scroll', resetTimer, true); // improved; see comments
  function yourFunction() {
    console.log("inactive");
    for (var i = 0; i < numOfElements; i++) {
      elementSelector([i]);
    }
    changeToOs();

  }

  function resetTimer() {
    console.log("timer has been reset");
    clearTimeout(t);
    t = setTimeout(yourFunction, 9000); // time is in milliseconds
    changeToOs();
  }
}
idleLogout();
console.log(functionIsRunning)

<a href="google.com" class="flowerText">GooGLE 1</a><br>
<a href="google.com" class="flowerText">GoOGLE 2</a><br>
<a href="google.com" class="flowerText">GOoGLE 3</a><br>
<a href="google.com" class="flowerText">GOOGLE 4</a><br>
<a href="google.com" class="flowerText">GooGLE 5</a>

标签： javascript