检查鼠标按钮是不是按下按钮/图片并每隔几秒钟继续执行一个功能直到按下按钮？

Posted 2023-05-08

【中文标题】检查鼠标按钮是不是按下按钮/图片并每隔几秒钟继续执行一个功能直到按下按钮？

【英文标题】：Check if mouse button is down on a button/picture and keep executing a function after every few seconds till the button is pressed?检查鼠标按钮是否按下按钮/图片并每隔几秒钟继续执行一个功能直到按下按钮？

【发布时间】：2016-12-05 13:46:57

【问题描述】：

基本上我想要做的是，我试图调用一个函数并在每“n”秒后重复相同的函数，直到按下鼠标按钮(MouseDown) 在按钮/图片上，并在释放鼠标按钮 (MouseUp) 时停止调用该函数。我正在尝试使用 JavaScript 来做到这一点！

一些参考文献

https://api.jquery.com/mousedown/

How can I detect a rightmouse button event on mousedown?

javascript: Check if mouse button down?

【问题讨论】：

I am trying to call a function 是否在用户点击鼠标之后？

是的，并且每隔“n”秒重复相同的功能，直到按下按钮！

【参考方案1】：

未测试，但提供一个想法。

var state = false;

function repeatingFunction()
    if (!state)
        return;
    
    console.log("Do something");
    setTimeout(repeatingFunction, 2000);

function mymousedown(ev)
    state = true;
    repeatingFunction();

function mymouseup(ev)
    state = false;

var obj = document.getElementById("foo");
obj.addEventListener("mousedown", mymousedown);
obj.addEventListener("mouseup", mymouseup);

【讨论】：

我试过了，但是没用。检查我是否犯了任何错误：jsfiddle.net/7Lke4t8y

是的，小错误。应该是 document.getElement.. 而不是 window.

【参考方案2】：

这应该适合你：

var timerId = 0;

function onmousedown(ev) 
    console.log("Do something");  //first call right after mouse down
    timerId = setInterval(function () 
        console.log("Do something");
    , 2000);

function onmouseup(ev) 
    clearInterval(timerId);


var obj = document.getElementById("foo");
obj.addEventListener("mousedown", onmousedown);
obj.addEventListener("mouseup", onmouseup);

小提琴：https://jsfiddle.net/kLnjh9zd/