從 JavaScript 以編程方式觸發 DOM 鼠標事件

Question

是否可以在 DOM 中以編程方式觸發鼠標事件？ 我的示例案例如下：

<html>
  <body>
    <iframe style="width: 500px; height: 500px;" src="something.html"></iframe>
    <div id="layer" style="position: absolute; left: 0px; top=0px; width=500px; height=500px;"></div>
  </body>
</html>

每當用戶在iframe單擊div ，我也想以某種方式將事件傳播到iframe 。 （這里我們假設iframe src在同一個域中。）

Answer 1

雖然您可以將事件注入瀏覽器的事件處理系統（以不完全可移植的方式），但它只會導致在這些事件上注冊的事件處理程序被調用。 它不會導致諸如點擊鏈接之類的默認操作。 此外，您不會從坐標中為您計算出目標元素，因此您必須自己做。

更好的選擇是去掉模糊的<div>並在 iframe 的文檔上注冊一個click處理程序，然后通知父級中的代碼點擊的位置。

Answer 2

如果您曾經遇到過<iframe>的父項和子項位於不同域的情況，我建議您學習使用postMessage() 。

使用postMessage()您可以像這樣收聽"message"事件：

window.addEventListener("message", (event) => {}

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

我想添加這個，因為不久前，我很難找到最好的方法。 此外， postMessage()在某些情況下很有用，當您想控制事物時，您想在 iframe 中收聽。

從 JavaScript 以編程方式觸發 DOM 鼠標事件

問題描述

2 個解決方案

解決方案1
2 已采納 2010-08-24 12:05:22

解決方案2
0 2020-12-21 07:46:29

從 JavaScript 以編程方式觸發 DOM 鼠標事件

問題描述

2 個解決方案

解決方案1 2 已采納 2010-08-24 12:05:22

解決方案2 0 2020-12-21 07:46:29

解決方案1
2 已采納 2010-08-24 12:05:22

解決方案2
0 2020-12-21 07:46:29