4

js禁止复制页面文字

 1 year ago
source link: https://www.fly63.com/article/detial/12094
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

更新日期: 2022-09-07阅读: 17标签: 文字分享

扫一扫分享

做项目的时候有客户提出要求，不能用用户浏览他发表的文章时复制他的文章,一种比较简单的方法，禁止用户选中页面的文字和禁止用户右键菜单:

document.oncontextmenu = new Function("event.returnValue=false");
document.onselectstart = new Function("event.returnValue=false");

如果只是禁止部分区域的话，直接在标签上加上onselectstart=“return false”

<div onselectstart="return false" id="div" >
此区域禁止复制
</div>
<div onselectstart="return false" id="div" >
此区域禁止复制
</div>
<script type="text/javascript" >
    $(document).ready(function(){
          document.getElementById('div').onselectstart =function(){
                return false;
          };
    });
</script>

在火狐下这种js写法是无效的,在火狐下有个屏蔽选择样式的样式属性 -moz-user-select （只支持火狐浏览器）

<div style="-moz-user-select:none;" >
    禁止复制此区域
</div>

如果要禁止整个页面

<script type="text/javascript" >
    $(document).ready(function(){
         $("body").css("-moz-user-select","none");
    });
</script>

-moz-user-select主要有三个值 none -moz-all -moz-none 

 Input表单中文字一般页面文字
none不可选不可选
-moz-all不可选可选
-moz-none可选不可选

链接: https://www.fly63.com/article/detial/12094


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK