如何使用 JavaScript 偵測跨網域 iFrame 內的點擊？

使用 JavaScript 捕獲跨域 iFrame 中的點擊

由於安全限制，檢測跨域 iFrame 中的用戶交互可能具有挑戰性。但是，可以使用創造性的方法來追蹤 iframe 內是否發生了點擊。

解決方案：

要從iframe 捕獲點擊事件，請考慮以下方法：

1.建立一個不可見的div ：

將一個不可見的div 直接放在iframe上。此 div 將捕獲 iframe 內的任何點擊。

2.利用視窗模糊事件：

當使用者在 iframe 內點選時，會導致父視窗失去焦點。透過監聽視窗模糊事件，您可以偵測點擊。

3.檢查活動元素：

在模糊事件處理程序中，檢查活動元素是否為 IFRAME。如果是，則點擊發生在 iframe 內。

4.通知事件：

更新指定元素，例如

，以指示 iframe 中發生了點擊。

代碼片段：

下面的例子演示瞭如何實現這個解決方案：

const message = document.getElementById("message");

// Focus main document to detect iframe clicks
window.focus();

window.addEventListener("blur", () => {
  setTimeout(() => {
    if (document.activeElement.tagName === "IFRAME") {
      message.textContent = "clicked " + Date.now();
      console.log("clicked");
    }
  });
}, { once: true });

注意：

此解決方案可能不與所有瀏覽器相容，並且可能會出現計時和焦點處理問題。建議測試和自訂程式碼以適合您的特定應用程式。

以上是如何使用 JavaScript 偵測跨網域 iFrame 內的點擊？的詳細內容。更多資訊請關注PHP中文網其他相關文章！