Javascript在旧浏览器中执行点击html“图像”答案

【问题标题】：Javascript perform click on html "image" in old browserJavascript在旧浏览器中执行点击html“图像”
【发布时间】：2016-04-15 03:05:24
【问题描述】：

我正在尝试单击 <image> 元素。我发现：

[3] 旧版本只有 HTMLInputElement.click() 和 HTMLButtonElement.click()。

有人知道我怎样才能通过其他方式触发相同的事件吗？

谢谢

编辑：.click() 适用于所有浏览器。但我需要在 Android 的 2.3 浏览器上执行此操作，它给了我：

01-10 21:19:18.375 4786-4786/com.example.victormilazzo.siganotifier E/Web Console: TypeError: Result of expression 'document.getElementById('btnLogin2').click' [undefined] is not a function. at undefined:1

使用下面的代码解决了

正如我所说，旧浏览器仅支持输入或按钮元素的 click() 方法。所以，我尝试了：

function simulateclick(){
    var elem = document.getElementById('btnLogin2');
    var evt = document.createEvent('MouseEvents');
    evt.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, elem);
    elem.dispatchEvent(evt);
}
var btn = document.createElement('BUTTON');
btn.addEventListener('click', simulateclick);
btn.click();

PS.: 'btnLogin2' 是我试图点击的元素的 ID。这是<div>。

说明：我刚刚创建了一个按钮并添加了一个模拟点击事件的事件监听器

谢谢大家！

【问题讨论】：

您打算使用哪个浏览器和版本？
IE6及以上可以点击任何东西

标签： javascript image browser onclick

【解决方案1】：

如果您针对的是旧版浏览器，则只能在输入或按钮元素上附加点击事件。可以通过使用 CSS 属性 background-image 设置按钮样式来解决此问题。

为按钮添加图片
将背景色设置为白色
将边框设置为无

在代码示例中，您会看到这是如何工作的：

var clickCounter = 0;
var messageBox = document.getElementById("message");

function clickMe() {
  clickCounter++;
  messageBox.innerHTML = "Clicked " + clickCounter + " times";
}

button {
  background-image: url(data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7);
  height: 70px;
  width: 70px;
  background-color: white;
  border: none;
}

<button onclick="clickMe()"></button>
<p id="message">Click me</p>

编辑：

Android 浏览器不支持点击事件，您可以在 MDN 文档中看到。click documentation

【讨论】：

没问题，伙计。也许您可以接受这个答案是正确的？

【解决方案2】：

我无法真正对此进行测试，但如果您使用 onClick 属性并指向执行点击事件的 JS 函数，则应该可以解决问题。

JS：

function imageClick() { // do clicky stuff }

和标记

<img src="img.jpg" onclick="imageClick()" />

【讨论】：