禁止网页通过鼠标选择文本进行复制

2015/12/20 21:23:13 人评论 次浏览 分类:JavaScript


    有时候自己的网页内容为了防止被别人轻易复制,所以需要想个法子禁止鼠标选择文本右键复制。后面就找到了下面的方法来实现,这个也是目前最常用和最实用的方式了,但是这种方式还是无法完全地实现这个禁止鼠标选择文本的需求,只能说是尽量,这种方式主要是通过JS和CSS的方式实现的,如果稍微对浏览器网页有点熟悉的用户就会可以通过查看鼠标右键源代码的方式,或者是通过将网页另存为的方式实现查看文本。这方式连百度爬虫也是可以爬到的。

主要思路:
1.防止网页上的文字被选择。
2.防止使用ctrl+C的方式进行复制,防止使用鼠标右键实现复制。

下面具体说一下如何通过js结合css的方式实现禁止鼠标选择复制文字。

【禁止鼠标选择文字】
一、通过JS来实现的禁止用鼠标选择文字的功能(仅支持IE浏览器):
onselectstart="javascript:return false;"
document.body.onselectstart = document.body.ondrag = function() {
     return false;
}
二、使用CSS样式来实现的禁止用鼠标选择文字功能:
IE浏览器通过unselectable实现。
Chrome、Safari通过onselectstart实现。
firefox火狐浏览器通过-moz-user-select实现。

某个div元素的实现方式:
<div style="-moz-user-select:none;" onselectstart="return false;"unselectable="on"></div>


屏蔽选择的样式定义:-moz-user-select属性(-moz前缀只支持firefox)。
user-select属性值说明:
1、 none:用none,子元素所有的文字都不能选择,包括input输入框中的文字也不能选择。
2、 -moz-all:子元素所有的文字都可以被选择,但是input输入框中的文字不可以被选择。
3、 -moz-none:子元素所有的文字都不能选择,但是input输入框中的文字除外。
例如全局所有元素的文字不能选择的写法:
html,body{-moz-user-select: none; -khtml-user-select: none; user-select: none;}

【禁止使用复制】

//防止使用Ctrl+C实现复制:
$(document).keydown(function (event) {
      if (event.altKey || event.ctrlKey) {
          return false;
      }
 });

//防止使用右键实现复制:
document.oncontextmenu = function () { return false };


【综合】

CSS部分:
body{-moz-user-select:   none;}


JS部分:
document.onselectstart = function () {
      return false;
};

//防止使用Ctrl+C实现复制:
$(document).keydown(function (event) {
      if (event.altKey || event.ctrlKey) {
          return false;
      }
 });

//防止使用右键实现复制:
document.oncontextmenu = function () { return false };




相关资讯

  • Js通过referrer获取搜索引擎来源

    在做网站优化的时候,需要了解用户搜索引擎来源,可以在Html页面中通过JS获取document.referrer,然后在document.referrer中通过搜索引擎对应的域名进行识别。 比如百度对应域名中的存在‘baidu’,360 搜中,含有so.com,可以作为标识。

    2016/5/20 11:17:05

共有访客发表了评论 网友评论

验证码: 看不清楚?