我需要一个在按下按钮时执行功能并在松开按钮时停止执行的功能
$('#button').--while being held down--(function() {
//execute continuously
});
Jquery：鼠标按下效果（按住左键时）
IT技术
javascript
jquery
mouse
click
2021-03-04 19:56:44
4个回答
我相信这样的事情会奏效：
var timeout, clicker = $('#clicker');
clicker.mousedown(function(){
timeout = setInterval(function(){
// Do something continuously
}, 500);
return false;
});
$(document).mouseup(function(){
clearInterval(timeout);
return false;
});
看这个演示：http : //jsfiddle.net/8FmRd/
对原始答案的小修改：
$('#Clicker').mousedown(function () {
//do something here
timeout = setInterval(function () {
//do same thing here again
}, 500);
return false;
});
$('#Clicker').mouseup(function () {
clearInterval(timeout);
return false;
});
$('#Clicker').mouseout(function () {
clearInterval(timeout);
return false;
});
通过 Clicker 上的 mouseout 事件，当您将鼠标移出点击区域时，它会停止。
之所以建议同样的事情做两次，是为了获得更流畅的效果。如果在设置超时之前没有执行一次，则在这种情况下，会延迟 500 毫秒，然后才会发生。
这是所提供解决方案的纯 JavaScript 实现，它扩展了对触摸屏的支持。您提供id,action以执行 ( function(){}) 和interval(ms) 以重复action. 请注意，此实现还将action立即执行，而不是等待interval失效。
// Configures an element to execute a function periodically whilst it holds the user's attention via a mouse press and hold.
function assertPeriodicPress(id, action, interval) {
// Listen for the MouseDown event.
document.getElementById(id).addEventListener('mousedown', function(ev) { action(); timeout = setInterval(action, interval); return false; }, false);
// Listen for mouse up events.
document.getElementById(id).addEventListener('mouseup', function(ev) { clearInterval(timeout); return false; }, false);
// Listen out for touch end events.
document.getElementById(id).addEventListener('touchend', function(ev) { clearInterval(timeout); return false; }, false);
}
$.fn.click2=function(cb,interval){
var timeout;
if(!interval) interval=100;
$(this).mousedown(function () {
var target=this;
timeout = setInterval(function(){
cb.apply(target);
}, interval);
return false;
}).mouseup(function () {
clearInterval(timeout);
return false;
}).mouseout(function () {
clearInterval(timeout);
return false;
});
}