我希望有一个更优雅的解决方案来解决这个问题。基本上,我有一个 HTML/Javascript 应用程序,将在触摸屏信息亭上运行。如果有人通过拖动手指滚动按钮列表,我试图阻止默认的单击行为。起初,当它检测到滑动事件时,我尝试阻止Default。但后来我突然意识到,这并不是真正的滑动事件,而是长时间的鼠标按下。所以我写了下面的代码:
var downClick;
var startTime;
$(".TPGSW-wrapper").on('mousedown', function () {
downClick = new Date();
startTime = downClick.getTime();
});
$(".TPGSW-wrapper").on('mouseup', function () {
var upClick = new Date();
var endTime = upClick.getTime();
if (endTime - startTime < 250) {
return false;
} else if (endTime - startTime >= 300) {
// This is the action that I can't seem to get to work.
// I would like it to stop the click event. I also tried mouseup
this.on('click', function () { preventDefault; });
}
});
这正确地测量了鼠标按下的时间,但是我似乎无法阻止单击事件的触发。有什么想法或建议吗?我正在使用 jquery,这仅适用于 webkit 浏览器。提前致谢!
最佳答案
好的,经过一些测试,我能够让它与以下代码一起工作:
var longpress = false;
$(".TPGSW-wrapper").on('click', function (e) {
(longpress) ? e.preventDefault() : alert("clicked");
});
var startTime, endTime;
$(".TPGSW-wrapper").on('mousedown', function () {
startTime = new Date().getTime();
});
$(".TPGSW-wrapper").on('mouseup', function () {
endTime = new Date().getTime();
if (endTime - startTime < 250) {
longpress = false;
console.log('< 250');
} else if (endTime - startTime >= 300) {
longpress = true;
console.log('>= 300');
}
});
如果按住鼠标的时间少于 250 毫秒,则会触发点击事件,如果超过 300 毫秒,则会调用 e.preventDefault
并停止点击事件。
关于javascript - 检测 mousedown 事件持续多长时间,然后在超过一定时间后阻止 mouseup 操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15621137/