如何模拟点击<input type="image" />？答案

【问题标题】：How to simulate click on <input type="image" />?如何模拟点击<input type="image" />？
【发布时间】：2009-11-05 19:09:51
【问题描述】：

当我们使用这种类型的输入提交表单时，坐标 (x,y) 会附加到结果中。

如果我动态创建 2 个隐藏输入，它会起作用，但我想要一些不同的东西。
Event 或 MouseEvent 会很棒，但我无法让它工作

这是我当前的代码：（它工作正常）

var input = document.createElement("input");
input.type = "hidden";
input.name = "x";
input.value = posx;
my_form.appendChild(input);

input = input.cloneNode(false);
input.name = "y";
input.value = posy;
my_form.appendChild(input);

我给你举个例子

假设在图片表单元素附近有一个纯文本，上面写着：点击下图中大于 20 小于 60 的任意位置

普通人会读到这里并正常点击。
但是我需要，作为一个没有手的机器人，模拟同样的点击事件

【问题讨论】：

你使用的是框架还是纯javascript？
很好奇 posx 和 posy 是如何填充的......
让我们说“posx”和“posy”必须是20到60之间的任何整数
这真的很难做到。您拥有的是最可接受的解决方案 IMO。考虑到由于这个老错误webbugtrack.blogspot.com/2007/10/…，这个动态输入代码在 IE 中不起作用
很好地找到了 Roatin Marth。但 IE 不是问题，我正在尝试使用 FX。 :)

标签： javascript image click simulation

【解决方案1】：

如果没有完全理解你在这里尝试做什么（你的问题有点模糊，IMO），我不得不问这个：你有没有考虑过使用 jQuery 或其他 javascript 库/框架？我理解有时，对于非常简单的网站，它是矫枉过正的。但是，减轻您自己解决这些问题的麻烦可能是值得的。

据我所知，您正在使用“图像”表单元素提交表单，并且您想模拟单击图像元素以检索某物的 x/y 坐标。我可能是错的。能否详细说明一下？

当我对您的问题有更多了解后，我会看看能否向您展示如何在 jQuery 中执行此操作。

【讨论】：

是的，这正是我想要做的。我想在图像表单元素中检索模拟鼠标单击的坐标。就像我手动单击图像一样。如果 jQuery 是解决方案，那么我将保留隐藏的输入。谢谢

【解决方案2】：

我不知道您试图将结果附加到什么。表格中的值？这是自动的，不需要代码（它们遇到 x 和 y，或 elementname.x 和 elementname.y）。

评论后编辑：
您可以通过当时不制作元素来避免节点插入事件；即在表单中添加 x 和 y。然后在事件中，您可以简单地设置它们的值。当然，您也可以绑定不同的事件，我不知道您的情况，但我制作了an example，它使用附加到页面本身的 onClick 事件。相反，您可能希望将特定的 onClick 事件绑定到不同的可点击项目并为它们插入您自己的位置，但在我的情况下，我在页面上提交了鼠标的位置。如果这没有帮助，请评论原因，我会看看我是否可以再次修改它。

【讨论】：

如果我只使用click()，坐标发送为0,0。我想模拟我想要的任何其他坐标。
这仍然没有意义 - 也许您可以逐步解释逻辑应该是什么？
我明白了。我无法理解你为什么想要那个，但我不需要。我会考虑一个解决方案并编辑我的答案。
您实际上可以将元素添加到没有值的表单中并动态设置值，而不是动态生成元素本身。您的代码是否只有一个长度的问题 - 太长而无法舒适地放置在点击事件上？
我的代码太长，被 DOMNodeInserted 事件捕获（不良副作用）。我期望使用 createEvent()、initMouseEvent() 和 dispatchEvent() 的东西。但我的尝试都没有奏效。也许我做错了什么。