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 相关文章推荐
JavaScript实际应用:innerHTMl和确认提示的使用
Jun 22 Javascript
jquery 模拟类搜索框自动完成搜索提示功能(改进)
May 24 Javascript
判断客户端浏览器是否安装了Flash插件的多种方法
Aug 11 Javascript
Javascript 中 null、NaN和undefined的区别总结
Apr 10 Javascript
javascript生成随机颜色示例代码
May 05 Javascript
node.js回调函数之阻塞调用与非阻塞调用
Nov 13 Javascript
jquery获取点击控件的绝对位置简单实例
Oct 13 Javascript
利用n工具轻松管理Node.js的版本
Apr 21 Javascript
详解javascript函数写法大全
Mar 25 Javascript
Layui数据表格跳转到指定页的实现方法
Sep 05 Javascript
electron踩坑之remote of undefined的解决
Oct 06 Javascript
antd多选下拉框一行展示的实现方式
Oct 31 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
showModalDialog模态对话框的使用详解以及浏览器兼容
2014/01/11 Javascript
浅谈Jquery为元素绑定事件
2015/04/27 Javascript
原生JS实现首页进度加载动画
2016/09/14 Javascript
webpack3+React 的配置全解
2017/08/21 Javascript
ES6 迭代器(Iterator)和 for.of循环使用方法学习(总结)
2018/02/08 Javascript
AngularJS模态框模板ngDialog的使用详解
2018/05/11 Javascript
Vue之mixin全局的用法详解
2018/08/22 Javascript
Node.js中的不安全跳转如何防御详解
2018/10/21 Javascript
小程序实现左右来回滚动字幕效果
2018/12/28 Javascript
vue实现简单的登录弹出框
2020/10/26 Javascript
jenkins自动构建发布vue项目的方法步骤
2021/01/04 Vue.js
浅谈Python的Django框架中的缓存控制
2015/07/24 Python
Python代码解决RenderView窗口not found问题
2016/08/28 Python
用tensorflow实现弹性网络回归算法
2018/01/09 Python
python使用mysql的两种使用方式
2018/03/07 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
Flask框架使用DBUtils模块连接数据库操作示例
2018/07/20 Python
Python中实现单例模式的n种方式和原理
2018/11/14 Python
提升Python程序性能的7个习惯
2019/04/14 Python
Python中Numpy ndarray的使用详解
2019/05/24 Python
python hough变换检测直线的实现方法
2019/07/12 Python
解决在pycharm运行代码,调用CMD窗口的命令运行显示乱码问题
2019/08/23 Python
Python爬取12306车次信息代码详解
2020/08/12 Python
一款CSS3实现多功能下拉菜单(带分享按)的教程
2014/11/05 HTML / CSS
阿里巴巴国际站:Alibaba.com
2016/07/21 全球购物
斯洛伐克时尚服装网上商店:Cellbes
2016/10/20 全球购物
联想瑞士官方网站:Lenovo Switzerland
2017/11/19 全球购物
27个经典Linux面试题及答案,你知道几个?
2014/03/11 面试题
结构工程个人自荐信范文
2013/11/30 职场文书
小溪流的歌教学反思
2014/02/13 职场文书
2015年元旦促销方案书
2014/12/09 职场文书
学校办公室主任岗位职责
2015/04/01 职场文书
毕业生求职自荐信(2016最新版)
2016/01/28 职场文书
深入理解java.lang.String类的不可变性
2021/06/27 Java/Android
使用CSS3实现按钮悬停闪烁动态特效代码
2021/08/30 HTML / CSS
星际争霸 Light vs Action 一场把教主看到鬼畜的比赛
2022/04/01 星际争霸