如何在 JavaScript 中使鼠标双击？答案

【问题标题】：How to make mouse double click in JavaScript?如何在 JavaScript 中使鼠标双击？
【发布时间】：2018-06-07 10:38:36
【问题描述】：

我需要一个 JavaScript 代码来让鼠标自己双击。我将在我的 Java 代码中使用它。这是一个用于测试目的的 selenium 项目，但没有任何方法可以在 selenium 中双击鼠标，所以我想在我的 java 代码中使用 javaScript 来做到这一点。你有什么主意吗？

This is old question of me "How to double click any where on web page?"

他们说我应该使用 JavaScript 来进行鼠标双击，但是怎么做呢？

【问题讨论】：

如果您查看文档，它会说明可用选项是什么...使用Actions.doubleClick(WebElement)。不需要 javascript 解决方法。
我不想点击普通的网页元素。我将点击谷歌地图，所以它不起作用。 Click() 方法有效，但 DoubleClick() 在我的情况下没用。
谷歌地图IS是一个普通元素。它由CANVAS 标签组成。你觉得你在用JS双击什么？
@JeffC OP 正在通过 JavaScript 寻找答案。我不明白 JavaScript 有什么问题，它是最广泛接受和最强大的 Selenium 支持绑定之一，并且集成在 Selenium-Java 和 Selenium-Python 客户端中。您对 JavaScript 的不了解以及随后对潜在好答案的否决结果对 stackoverflow 社区产生了反作用。
@DebanjanB OP 正在寻找 Javascript 答案，因为您在他之前的问题中告诉他（这不是必需的）。我完全了解 JS 及其功能，但在某些时候您需要问自己……如果我要使用的只是运行 JS 命令的能力，我为什么要使用 Selenium？使用 JS 不是许多人在编写自动化时试图完成的用户场景。通过告诉没有经验的人使用 JS 而没有解释其他更好的选择和缺点是什么，你会适得其反。

标签： javascript selenium selenium-webdriver

【解决方案1】：

要制作Mouse Double Click，您可以编写一个脚本并将其传递给executeScript() 方法，如下所示：

脚本：

String jsDoubleClick = 
  "var target = arguments[0];                                 " +
  "var offsetX = arguments[1];                                " +
  "var offsetY = arguments[2];                                " + 
  "var rect = target.getBoundingClientRect();                 " +
  "var cx = rect.left + (offsetX || (rect.width / 2));        " +        
  "var cy = rect.top + (offsetY || (rect.height / 2));        " +
  "                                                           " +
  "emit('mousedown', {clientX: cx, clientY: cy, buttons: 1}); " +
  "emit('mouseup',   {clientX: cx, clientY: cy});             " +
  "emit('mousedown', {clientX: cx, clientY: cy, buttons: 1}); " +
  "emit('mouseup',   {clientX: cx, clientY: cy});             " +
  "emit('click',     {clientX: cx, clientY: cy, detail: 2});  " +
  "                                                           " +
  "function emit(name, init) {                                " +
    "target.dispatchEvent(new MouseEvent(name, init));        " +
  "}                                                          " ;

通过executeScript() 从您的@Test 调用脚本：

new Actions(driver).moveToElement(myElem, posX, posY).perform();
((JavascriptExecutor)driver).executeScript(jsDoubleClick, myElem, posX, posY);

【讨论】：

我说的是：使用 jquery ！ ;-)
我很快就会试试这个。我会在 24 小时内接受答复，谢谢大家。

【解决方案2】：

As Mozfet says JQuery ! it's so easy with JQuery ! 

$("#myId").trigger('dblclick');

then you listen for this double click 
$("#myId").on('dblclick',function(){
// do it !
});

// you can event make you own event 
$("#myId").trigger('retrieve');

then you listen for this custom event 
$("#myId").on('retrieve',function(){
// do it !
});

我经常在数据表中使用它：如果用户选择“打开模式”，我有一个弹出框（每行左侧 td 的一个小菜单），然后触发双击进入已经存在的表等待用户双击该行。所以我不需要实现 2 个事件

【讨论】：

谢谢，但问题是我不能从 Java 代码中调用它。
我还以为是错字！你为什么要从后面调用它？常见的方法是在解析时从后面编写一些js，以便在浏览器中加载时执行代码。或者您通过 ajax 调用向后面询问某些内容，然后通过特定的响应在浏览器上触发您的事件。你到底想要什么？不要犹豫，解释更多

【解决方案3】：

使用 JQuery：

 $(selector).dblclick()

【讨论】：