javascript - 查找用户在 iframe 中单击的元素

Question

我正在使用一个 HTML 编辑器iframe，我希望用户能够在添加后调整图像大小。因此，当用户单击内部的图像时，iframe就会运行一个侦听器。但它给我的只是body标签而不是点击的元素。我已经尝试了很多方法，但似乎都没有奏效。

我在这个领域的代码是：

//网站展示的是iframe

//iframeBody是iframe内body的id

siteDisplay.document.getElementById('iframeBody').addEventListener("click", testForClicks, false); 


function testForClicks(){

 console.log(siteDisplay.document.activeElement);

 console.log(this);

 //both give me bodytag

}

我需要点击元素或突出显示元素

任何帮助都会很棒，谢谢

Answer 1

如果您需要突出显示的（或活动的）元素，您可以使用Selection/ Range（链接）API

var selection = window.getSelection();
var range = selection.getRangeAt(0);
var firstNode = range.startContainer;
// etc.

Answer 2

iframe 就像在您的窗口内打开的单独窗口。所以，

iframe = document.getElementById('YourIframeId');
iframe.contentDocument.getElementById('innerIframeElementId').addEventListen......

这将起作用。此外，如果您想访问 iframe 窗口，请执行以下操作：

iframe.contentWindow.

希望这可以帮助。