如何使用 JavaScript 检测跨域 Iframe 内的点击？

使用 JavaScript 检测 iframe 内的点击

如果您正在寻找一种方法来确定用户是否在 iframe 内点击，您可以可能偶然发现跨域 iframe 无法直接在 JavaScript 中监控的限制。尽管如此，有一个聪明的技术可以帮助您实现目标。

解决方案在于在 iframe 上覆盖一个不可见的 div。当 iframe 内发生点击时，也会触发覆盖的 div 的点击事件。通过监听此事件，您可以间接检测 iframe 内的点击。

下面是一个代码示例来说明此方法：

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

// Ensure the main document has focus to register the blur event.
window.focus();

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

<div>

在此示例中，消息 div用于在 iframe 内发生点击时显示“clicked”以及时间戳。请注意，此方法在 Chrome、Firefox 和 IE 11（以及其他可能的浏览器）中有效。它提供了一个简单的解决方案来监控跨域 iframe 中的用户交互，特别是当您无法控制所使用的 iframe 标签时。

以上是如何使用 JavaScript 检测跨域 Iframe 内的点击？的详细内容。更多信息请关注PHP中文网其他相关文章！