Question

在点击事件中，如何知道双击。如果是点击，我想要回归;但怎么能知道它是双击？

<hr style="clear:both; width:100%;" />
<p id="testClick">Click here</p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
$(document).ready(function () {
        $("#testClick").click(function () {
            //if double click: console.log("2"); and return 
            //else
            // do some thing
            console.log("1");
        });
    });
 </script>

Answer 1

单击处理程序无法知道。你必须在这个答案中构建一个自定义逻辑：how to detect a double on a single click in jquery

我建议你听听这两个事件并围绕它建立你的逻辑。如果您只需要了解双击，请不要听单击。

使用dblclick事件处理程序：

<hr style="clear:both; width:100%;" />
<p id="testClick">Click here</p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
$(document).ready(function () {
        $("#testClick").click(function () {
            console.log("click"); // Here do nothing !
        });
        $("#testClick").dblclick(function () {
            console.log("double click");
        });
    });
 </script>

Answer 2

另一个答案基本上是正确的，但它比那个更复杂

<hr style="clear:both; width:100%;" />
<p id="testClick">Click here</p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
    var isDoubleClick = false;

    $("#testClick").click(function () {
        setTimeout(function() {
            if(!isDoubleClick) {
                console.log("1");
            }
        }, 500);
    });

    $("#testClick").dblclick(function () {
        console.log("2");
        isDoubleClick = true;

        setTimeout(function() {
            isDoubleClick = false;
        }, 1000);
    });
});
</script>

如果您因任何原因不想使用dblclick处理程序，请使用numClicks ++而不是布尔值。

如何在jquery中单击一次检测一个double

2 个答案: