如何在iframe中禁用复制粘贴

How do you disable copy paste within an iframe?

本文关键字:复制 iframe      更新时间:2023-09-26

我正在使用谷歌查看器api,我想禁用框架内的复制粘贴功能。
示例:

<iframe src="http://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>

这是我的解决方案(来自我的评论):

我想到的一个想法是在iframe上覆盖一个透明的div,这样你就根本无法与它交互。

演示

HTML

<div id="container">
  <div id="overlay">
  </div>
  <iframe src="http://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" frameborder="0"></iframe>
</div>

CSS

#overlay {
  width:590px;
  height:500px;
  z-index: 1;
  background-color:rgba(255,255,0,0.1);
}
iframe {
  width:600px;
  height:500px;
}
#container {
  position: relative;
}
#overlay, iframe {
  position: absolute;
  top: 0;
  left: 0;
}

我把覆盖(黄色框)的宽度做成了590px,所以滚动条仍然有10px。