Question

我有一个看起来像这样的iframe：

<!DOCTYPE html>
<html>
<body>

<iframe src="http://www.w3schools.com" style = 'height:100px;width:200px;' scrolling = 'no'>
  <p>Your browser does not support iframes.</p>
 </iframe>

</body>
</html>

因此，当我在iframe中按Tab键时，它会遍历所有链接，自动滚动到iframe中站点的底部。我想做的是制作iframe，使tab只在矩形框中高度= 100px，宽度= 200px，并忽略网站上的其他所有内容...基本上剪切其他不适合此矩形的内容。 ..

我尝试设置高度和宽度以及溢出：隐藏，但这似乎没有做到这一点。

Answer 1

这会阻止用户点击iframe中的任何内容，但出于某种原因，您仍然可以点击内部并通过以下标签:- {fiddle

<div id="IframeWrapper" style="position: relative;">
    <div id="iframeBlocker" style="position: absolute; top: 0; left: 0; width: 400px; height: 200px"></div>
    <iframe src="http://www.w3schools.com" style='height:200px;width:400px;' scrolling='no'>
        <p>Your browser does not support iframes.</p>
    </iframe>
</div>

Answer 2

您无法对此采取任何措施，但您可以在iframe上运行JS，以隐藏您不希望显示的iframe中的html内容

你可以参考这些类似的问题来获得这个想法：

Changing div in iframe using Jquery
jQuery, select element inside iframe, which is inside an iframe

此处有关于jQuery论坛的类似讨论：https://forum.jquery.com/topic/changing-elements-in-an-iframe

iframe禁用选项卡上的滚动

2 个答案: