论坛 › Web开发 › onmousedown失效

Sorawithcat 发表于 2024-1-16 19:02:30

onmousedown失效

我尝试了onmousedown和onpointerdown，但是在按下时并没有持续触发函数，仅执行了一次
var ganzi = document.getElementById("ganzi")
      var longth = 0;
      window.onpointerdown = function () {
            longth++;
            console.log(longth)
            setGanZiLongth(longth);
      }

      //设置杆子长度
      function setGanZiLongth(longth) {
            var ganzi = document.getElementById("ganzi");
            ganzi.style.height = `${longth}px`
      }

FishC 发表于 2024-1-16 19:02:56

onmousedown和onpointerdown事件确实只会在按下时触发一次，而不会持续触发函数。如果你希望在按下时持续触发函数，可以使用setInterval来定时执行函数。

以下是一个使用setInterval的示例代码：

var ganzi = document.getElementById("ganzi");
var longth = 0;
var interval;

ganzi.onmousedown = function () {
    interval = setInterval(function () {
      longth++;
      console.log(longth);
      setGanZiLongth(longth);
    }, 100); // 每100毫秒执行一次函数
};

ganzi.onmouseup = function () {
    clearInterval(interval); // 清除定时器
};

// 设置杆子长度
function setGanZiLongth(longth) {
    ganzi.style.height = `${longth}px`;
}

在上面的代码中，我们使用了onmousedown事件来启动定时器，并在每次定时器执行时增加longth的值并调用setGanZiLongth函数来更新杆子的长度。然后，在onmouseup事件中清除定时器，以停止持续触发函数。你可以根据实际需求调整定时器的间隔时间。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。

查看完整版本: onmousedown失效