Question

如何使用javascript以编程方式单击非按钮元素？或者在Firefox和Chrome等浏览器中至少可以使用它？

Answer 1

信不信由你，对于一个相当基本的点击，你可以在它上面调用click（但更多信息如下）：Live Example | Live Source

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Artificial Click</title>
</head>
<body>
  <div id="foo">xxxxxxx</div>
  <script>
    (function() {
      var foo = document.getElementById("foo");
      foo.addEventListener("click", function() {
        display("Clicked");
      }, false);
      setTimeout(function() {
        display("Artificial click:");
        foo.click(); // <==================== The artificial click
      }, 500);
      function display(msg) {
        var p = document.createElement('p');
        p.innerHTML = String(msg);
        document.body.appendChild(p);
      }
    })();
  </script>
</body>
</html>

您还可以创建相关类型的Event对象，并使用dispatchEvent将其发送到元素：

var e = new MouseEvent("click", {
  view: window,
  bubbles: true,
  cancelable: true
});
foo.dispatchEvent(e);

这使您有机会在您正在模拟的事件上执行设置其他信息（例如，典型的pageX和pageY）。

有关DOM事件规范的Section 5中各种事件对象类型的更多信息。

Answer 2

您可以使用HTMLElementObject.click()

像document.getElementById('div1').click()

这样的东西

请参阅more

Answer 3

或者在jQuery（documentation）中点击非按钮元素

$( "#nonButton" ).click();

或听取非按钮元素的点击

$("#nonButton").on("click", doSomething);

Answer 4

var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
document.getElementById("nonButton").dispatchEvent(evt);

请参阅：https://developer.mozilla.org/en-US/docs/Web/API/event.initMouseEvent

Answer 5

document.querySelectorAll('#front-chat-container div[role]')[0].click()

为我工作-单击div元素。

使用javascript以编程方式单击非按钮元素？

5 个答案: