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
Nov 25 Javascript
Javascript和Ajax中文乱码吐血版解决方案
Dec 21 Javascript
jQuery.Autocomplete实现自动完成功能(详解)
Jul 13 Javascript
JavaScript类和继承 this属性使用说明
Sep 03 Javascript
JQuery中阻止事件冒泡几种方式及其区别介绍
Jan 15 Javascript
jQuery学习笔记之jQuery原型属性和方法
Jun 09 Javascript
使用js dom和jquery分别实现简单增删改
Sep 11 Javascript
Angular实现购物车计算示例代码
Feb 21 Javascript
微信小程序左右滑动切换页面详解及实例代码
Feb 28 Javascript
解决vue-cli单页面手机应用input点击手机端虚拟键盘弹出盖住input问题
Aug 25 Javascript
Vue实现一个图片懒加载插件
Mar 11 Javascript
layer.open的自适应及居中及子页面标题的修改方法
Sep 05 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
一些常用的php函数
2006/12/06 PHP
PHP中$_SERVER的详细参数与说明
2008/07/29 PHP
反射调用private方法实践(php、java)
2015/12/21 PHP
Bootstrap+PHP实现多图上传功能实例详解
2018/04/08 PHP
php实现数组中出现次数超过一半的数字的统计方法
2018/10/14 PHP
Laravel基础_关于view共享数据的示例讲解
2019/10/14 PHP
关于laravel模板中生成URL的几种模式总结
2019/10/18 PHP
event.srcElement 用法笔记e.target
2009/12/18 Javascript
ExtJS GridPanel 根据条件改变字体颜色
2010/03/08 Javascript
jquery导航制件jquery鼠标经过变色效果示例
2013/12/05 Javascript
jquery+html5制作超酷的圆盘时钟表
2015/04/14 Javascript
简单实现Bootstrap标签页
2020/08/09 Javascript
jQuery树插件zTree使用方法详解
2017/05/02 jQuery
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
express默认日志组件morgan的方法
2018/04/05 Javascript
layUI的验证码功能及校验实例
2019/10/25 Javascript
微信小游戏中three.js离屏画布的示例代码
2020/10/12 Javascript
[02:35]DOTA2英雄基础教程 狙击手
2014/01/14 DOTA
[38:23]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS LGD第一场
2014/05/24 DOTA
Python出现segfault错误解决方法
2016/04/16 Python
Python黑魔法@property装饰器的使用技巧解析
2016/06/16 Python
使用Turtle画正螺旋线的方法
2017/09/22 Python
1 行 Python 代码快速实现 FTP 服务器
2018/01/25 Python
python爬取淘宝商品详情页数据
2018/02/23 Python
python实现图书管理系统
2018/03/12 Python
Python将一个Excel拆分为多个Excel
2018/11/07 Python
Python实现将多个空格换为一个空格.md的方法
2018/12/20 Python
CentOS6.9 Python环境配置(python2.7、pip、virtualenv)
2019/05/06 Python
wxPython之wx.DC绘制形状
2019/11/19 Python
使用 PyTorch 实现 MLP 并在 MNIST 数据集上验证方式
2020/01/08 Python
使用AJAX和Django获取数据的方法实例
2020/10/25 Python
美国环保婴儿用品公司:The Honest Company
2017/11/23 全球购物
英文演讲稿
2014/05/15 职场文书
第二批党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
Html5新增了哪些功能
2021/04/16 HTML / CSS
详解Python中的for循环
2022/04/30 Python