“他说风雨中这点痛算什么,擦干泪不要怕,至少我们还有梦!” “我相信我就是我,我相信明天,我相信青春没有地平线。”

相册
相册
以下功能均可通过其他代码进行实现,此处只挑选了简便、灵活的个别代码进行介绍
经测试目前以下代码均可在各大常见浏览器中正常使用
代码仅作页面优化作用,解决普通用户的操作行为

页面常用设置

设为首页

html上面图片拖动的时候会在一个新窗口打开。html上面图片拖动的时候会在一个新窗口打开。

oncontextmenu="return false"

加入收藏

html上面图片拖动的时候会在一个新窗口打开。html上面图片拖动的时候会在一个新窗口打开。

oncontextmenu="return false"

页面常用禁止项

禁止鼠标右键

当网页中的某些功能与浏览器自带右键功能发生冲突时,则可以通过不同的方式对页面进行优化。

方式一:可以通过给标签添加 oncontextmenu 属性来禁止鼠标右键。

<body oncontextmenu="return false"></body>

方式二:可以通过在<body>底部添加JS代码来禁止鼠标右键。

<script type="text/javascript">

document.oncontextmenu = function() { return false; };

</script>

禁止拖拽图片

当网页中图片的数量较多时,导致发生误触的概率增大,给用户带来不必要的不良体验,则可以通过不同的方式对页面进行优化。

方式一:可以通过给标签添加 ondragstart 属性来禁止拖拽图片。

<body ondragstart="return false"></body>

方式二:可以通过在<body>底部添加JS代码来禁止拖拽图片。

<script type="text/javascript">

let im = document.getElementsByTagName('img');

for(i in im)im[i].onmousedown = function() { return false; };

</script>

禁止复制文本

当页面中某些内容不想被用户复制,但又不想影响选中时,则可以通过不同的方式对页面进行优化,使右键复制和 Ctrl+C 失效(名存实亡)

方式一:给标签添加 oncopy 属性来禁止复制文本。

<body oncopy="return false"></body>

方式二:可以通过在<body>底部添加JS代码来禁止复制文本。

<script type="text/javascript">

document.oncopy = function() { return false; };

</script>

禁止剪切文本

当页面中某些内容不想被用户剪切,但又不想影响选中时,则可以通过不同的方式对页面进行优化,使右键剪切和 Ctrl+X 失效(名存实亡)

方式一:给标签添加 oncut 属性来禁止复制文本。

<body oncut="return false"></body>

方式二:可以通过在<body>底部添加JS代码来禁止复制文本。

<script type="text/javascript">

document.oncut = function() { return false; };

</script>

禁止粘贴文本

当用户操作输入框时,不想让用户以粘贴的形式输入信息,则可以通过不同的方式对页面进行优化,使右键粘贴和 Ctrl+V 失效(名存实亡)

方式一:给标签添加 onpaste 属性来禁止复制文本。

<body onpaste="return false"></body>

方式二:可以通过在<body>底部添加JS代码来禁止粘贴文本。

<script type="text/javascript">

document.onpaste = function() { return false; };

</script>

禁止选中内容

当页面中的某些内容不想被用户选中时,则可以通过不同的方式对页面进行优化。

方式一:给标签添加 onselectstart 属性来禁止选中内容。

<body onselectstart="return false"></body>

方式二:可以通过在CSS中添加 onselectstart 属性来禁止选中内容。

<style type="text/css">

*{ -moz-user-select: none; -o-user-select:none; -khtml-user-select:none;

-webkit-user-select:none; -ms-user-select:none; user-select:none; }

</style>

注:该方式可以更加灵活、简便的控制页面中需要禁止和无需禁止的部分

如果页面中的某些部分无需禁止,则将属性值none更换为text,重新写入所需部分的CSS即可


方式三:可以通过在<body>底部添加JS代码来禁止选中内容。

<script type="text/javascript">

document.onselectstart = function() { return false; };

</script>

页面组件自定义

鼠标指针

为了满足一些特殊页面样式的需求,可以通过在CSS中添加 cursor 属性来自定义鼠标指针样式。

<style type="text/css">

body { cursor: url( a1.png ), auto; }

</style>

属性值 描述
url

需使用的自定义光标的 URL

注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标

default 默认光标(通常是一个箭头)
auto 默认。浏览器设置的光标
crosshair 光标呈现为十字线
pointer 光标呈现为指示链接的指针(一只手)
move 此光标指示某对象可被移动
e-resize 此光标指示矩形框的边缘可被向右(东)移动
ne-resize 此光标指示矩形框的边缘可被向上及向右移动(北/东)
nw-resize 此光标指示矩形框的边缘可被向上及向左移动(北/西)
n-resize 此光标指示矩形框的边缘可被向上(北)移动
se-resize 此光标指示矩形框的边缘可被向下及向右移动(南/东)
sw-resize 此光标指示矩形框的边缘可被向下及向左移动(南/西)
s-resize 此光标指示矩形框的边缘可被向下移动(北/西)
w-resize 此光标指示矩形框的边缘可被向左移动(西)
text 此光标指示文本
wait 此光标指示程序正忙(通常是一只表或沙漏)
help 此光标指示可用的帮助(通常是一个问号或一个气球)

滚动条样式

html上面图片拖动的时候会在一个新窗口打开。html上面图片拖动的时候会在一个新窗口打开。

oncontextmenu="return false"

搜索引擎优化

SEO

html上面图片拖动的时候会在一个新窗口打开。html上面图片拖动的时候会在一个新窗口打开。

oncontextmenu="return false"

粤ICP备2021008709号