vue实现页面内容禁止选中功能,仅输入框和文本域可选


Posted in Javascript onNovember 09, 2019

上网上翻了翻,共找到两种方式

CSS样式控制,只需将下面代码复制到 vue应用下,index.html文件中的body标签上

*{ 
 -webkit-touch-callout:none; /*系统默认菜单被禁用*/ 
 -webkit-user-select:none; /*webkit浏览器*/ 
 -khtml-user-select:none; /*早期浏览器*/ 
 -moz-user-select:none;/*火狐*/ 
 -ms-user-select:none; /*IE10*/ 
 user-select:none; 
} 
input{ 
 -webkit-user-select:auto; /*webkit浏览器*/  
}
textarea{
 -webkit-user-select:auto; /*webkit浏览器*/
}

js控制方式,需要重写onselectstart(),onselect。(将下面代码复制到body标签上即可,注意此种写法输入框和文本域也不可选)

onselectstart='return false'
onselect='return false'
oncontextmenu='return false' #此句禁用鼠标右键

以上这篇vue实现页面内容禁止选中功能,仅输入框和文本域可选就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
关于juqery radio写法的兼容性问题(新老版本jquery)
Jun 14 Javascript
给jQuery方法添加回调函数一款插件的应用
Jan 21 Javascript
基于jquery插件制作左右按钮与标题文字图片切换效果
Nov 07 Javascript
jquery实现简单实用的打分程序实例
Jul 23 Javascript
关于获取DIV内部内容报错的原因分析及解决办法
Jan 29 Javascript
使用bootstrap-paginator.js 分页来进行ajax 异步分页请求示例
Mar 09 Javascript
使用node.js搭建服务器
May 20 Javascript
AngularJs ng-change事件/指令的用法小结
Nov 01 Javascript
详解vue2.6插槽更新v-slot用法总结
Mar 09 Javascript
vue.js使用v-model实现父子组件间的双向通信示例
Feb 05 Javascript
Vue Router的手写实现方法实现
Mar 02 Javascript
js+html+css实现手动轮播和自动轮播
Dec 30 Javascript
Vue 实现复制功能,不需要任何结构内容直接复制方式
Nov 09 #Javascript
Vue实现点击按钮复制文本内容的例子
Nov 09 #Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
Nov 09 #Javascript
JS+html5实现异步上传图片显示上传文件进度条功能示例
Nov 09 #Javascript
js实现的在本地预览图片功能示例
Nov 09 #Javascript
vue 取出v-for循环中的index值实例
Nov 09 #Javascript
Vue v-for循环之@click点击事件获取元素示例
Nov 09 #Javascript
You might like
7个鲜为人知却非常实用的PHP函数
2015/07/01 PHP
PHP中register_shutdown_function函数的基础介绍与用法详解
2017/11/28 PHP
php微信开发之图片回复功能
2018/06/14 PHP
在php的yii2框架中整合hbase库的方法
2018/09/20 PHP
浅谈PHP中的那些魔术常量
2020/12/02 PHP
javascript自执行函数之伪命名空间封装法
2010/12/25 Javascript
Web跨浏览器进程通信(Web跨域)
2013/04/17 Javascript
javascript修改IMG标签的src问题
2014/03/28 Javascript
javascript在网页中实现读取剪贴板粘贴截图功能
2014/06/07 Javascript
js实现圆盘记速表
2015/08/03 Javascript
jQuery控制文本框只能输入数字和字母及使用方法
2016/05/26 Javascript
JavaScript中数组slice和splice的对比小结
2016/09/22 Javascript
jquery实现图片平滑滚动详解
2017/03/22 jQuery
判断滚动条滑到底部触发事件(实例讲解)
2017/11/15 Javascript
Vue父子组件双向绑定传值的实现方法
2018/07/31 Javascript
layui点击按钮页面会自动刷新的解决方案
2019/10/25 Javascript
微信小程序实现组件顶端固定或底端固定效果(不随滚动而滚动)
2020/04/09 Javascript
python实现的udp协议Server和Client代码实例
2014/06/04 Python
Python快速排序算法实例分析
2017/11/29 Python
Python编程把二叉树打印成多行代码
2018/01/04 Python
浅析Python四种数据类型
2018/09/26 Python
selenium使用chrome浏览器测试(附chromedriver与chrome的对应关系表)
2018/11/29 Python
Python3实现汉语转换为汉语拼音
2019/07/08 Python
如何查看Django ORM执行的SQL语句的实现
2020/04/20 Python
tensorflow图像裁剪进行数据增强操作
2020/06/30 Python
属性与 @property 方法让你的python更高效
2020/09/21 Python
HTML5 在canvas中绘制文本附效果图
2014/06/23 HTML / CSS
一年级语文教学反思
2014/02/13 职场文书
幼师求职自荐信
2014/05/31 职场文书
工伤事故证明
2014/10/20 职场文书
检讨书范文2000字
2015/01/28 职场文书
2015年工商所工作总结
2015/05/21 职场文书
地道战观后感2000字
2015/06/04 职场文书
演讲比赛通讯稿
2015/07/18 职场文书
详解MySQL集群搭建
2021/05/26 MySQL
解析MySQL索引的作用
2022/03/03 MySQL