如何防止多次点击/点击的默认处理?

时间:2017-12-29 16:33:18

标签: javascript onclick click onclicklistener double-click

我正在研究一种用于音乐制作的简单Web工具。用户用鼠标反复点击区域或用手指轻敲(在触摸屏上),并且工具计算点击的平均速度(例如,160bpm)。就我而言,该区域是一个output HTML元素,但它也可能是任何其他元素。

由于点击或点击可能非常频繁,因此设备可以将其视为常规点击,而不是双击或双击。在第一种情况下,区域的内容被选中,因为它是双击的默认结果;在第二种情况下,网页不会被点击,而是缩放(例如在iOS中)。

如何防止桌面和触摸屏的不良行为?一些重要的要求:

  1. 我在寻找使用纯JavaScript 和本机浏览器API的解决方案,而不使用jQuery或其他框架。

  2. 该解决方案应该阻止在上述元素中单击 。如果用户在此元素之外的网页上的其他位置执行多次点击(或多次点击),则应照常处理。

1 个答案:

答案 0 :(得分:0)

要防止双击选择:

function clearSelection() {
    if(document.selection && document.selection.empty) {
        document.selection.empty();
    } else if(window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

示例来自:Prevent text selection after double click

要防止缩放移动设备,请使用元标记:

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

注意:如果您使用响应式设计,这只是一个可行的解决方案