网页禁用iframe子页面的右键
· 技术积累 · Html iframe

网页中禁用iframe页面的右键操作,网上找这个代码,好多给出的都没效果,最后还是找到个可以用的
(iframe子页面内容没加载之前由父页面控制,加载之后的右键操作由加载后的子页面控制)

原文:禁用iframe子页面鼠标右键

大多数的解决方案是,给iframe引入的子页面中添加如下代码:

document.oncontextmenu=function(){ 
  return false
}

引用原作者话:“上述代码确实没错,能够禁止iframe子页面右键功能。但是问题是如何将这段代码写入子页面,因为子页面通常都是动态引入的。下面就通过代码实例介绍一下,如何如果在父页面为子页面注册对应事件处理函数”

# 代码分析如下:
#(1).window.onload事件不能少,防止iframe并没有加载的时候就为其注册事件处理函数。
#(2)."palybox"是<iframe>元素的id属性值,通过document.getElementById可以获取此元素对象。
#(3).然后利用contentDocument属性可以获取子页面的进行相关操作。
#(4).最后注册contextmenu事件处理函数,返回return false即可禁用右键菜单。

# html代码:
<iframe id="palybox"  src=""></iframe>

# js代码:
<script type="text/javascript">
    window.onload=function(){
        document.getElementById('palybox').contentDocument.oncontextmenu = function(){ 
            return false;
        } 
    }
</script>

本文最后记录时间 2024-03-30
文章链接地址:
https://me.jinchuang.org/archives/940.html
本站文章除注明[转载|引用],均为本站原创内容,转载前请注明出处
纯CSS 蝴蝶飞舞动画效果
自用的网页鼠标指针
CSS3/jQuery实现移动端滑动图片层叠效果
HTML中文字的CSS 渐变样式

Ubuntu18.04源码安装Nginx

oCam 屏幕录像录屏软件

留言列表

  1. 时迁
    Windows 10 Microsoft Edge
    中国湖南省移动

    试了一下也不行,还是一样可以右键

    1. Awking
      Windows 10 Google Chrome
      中国湖南省联通

      页面内,对iframe的中网页右键无效,测试页面:https://me.jinchuang.org/test/t.html

      1. 时迁
        Windows 10 Microsoft Edge
        中国湖南省移动

        可能是你目标页面本身就有限制,你试试换成https://itab.link/ 照样可以右键 我这边用你刚刚发的源码改个其他网址照样对iframe的中网页右键是有效的

        1. Awking
          Windows 10 Google Chrome
          中国湖南省长沙市电信IDC机房

          确实,同域名的下可以,换了其他域名的就不行了

我要留言