按住按钮需要JavaScript代码

时间:2020-03-05 18:57:52  来源:igfitidea点击:

我想要一个尽可能短的最小JavaScript例程,当在按钮上发生鼠标按下时,它首先会像mouseclick一样做出响应,然后,如果用户按住该按钮,它就会做出响应,就好像用户在不断发送mouseclick并在一段时间后使用按住按钮的行为就像用户正在加速鼠标单击一样...基本上将其视为具有时间加速的按键重复。
即用户按住鼠标按钮(x =调用功能)x___x___x___x__x__x_x_x_x_xxxxxxx

解决方案

回答

当按下按钮时,使用预期的时间和函数x调用window.setTimeout,并在x的末尾重新设置计时器,但是这次间隔较小。

释放鼠标按钮时,使用window.clearTimeout清除超时。

回答

像下面的伪代码这样的东西可能会起作用。

var isClicked = false;
var clickCounter = 100;
function fnTrackClick(){
   if(isClicked){
      clickCounter--;
      setTimeout(clickCounter * 100, fnTrackClick);
   }
}

<input type="button" value="blah" onmousedown="isClicked=true;" onmouseover="fnTrackClick();" onmouseup="isClicked = false;" />

回答

只需将下面的toggleOn放在按钮的OnMouseDown中,将toggleOff放在按钮的OnMouseUp中。

var tid = 0;
var speed = 100;

function toggleOn(){
    if(tid==0){
        tid=setInterval('ThingToDo()',speed);
    }
}
function toggleOff(){
    if(tid!=0){
        clearInterval(tid);
        tid=0;
    }
}
function ThingToDo{

}

回答

function holdit(btn, action, start, speedup) {
    var t;

    var repeat = function () {
        action();
        t = setTimeout(repeat, start);
        start = start / speedup;
    }

    btn.mousedown = function() {
        repeat();
    }

    btn.mouseup = function () {
        clearTimeout(t);
    }
};

/* to use */
holdit(btn, function () { }, 1000, 2); /* x..1000ms..x..500ms..x..250ms..x */