vue实现页面内容禁止选中功能,仅输入框和文本域可选
2019-12-03 12:16
1646 查看
上网上翻了翻,共找到两种方式
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实现页面内容禁止选中功能,仅输入框和文本域可选就是小编分享给大家的全部内容了,希望能给大家一个参考
您可能感兴趣的文章:
相关文章推荐
- vue实现页面内容禁止选中,仅输入框和文本域可选
- js实现始终浮动在一个位置的广告和页面内容禁止选中
- vue实现的上传图片到数据库并显示到页面功能示例
- Laravel框架基于中间件实现禁止未登录用户访问页面功能示例
- vue实现文章内容过长点击阅读全文功能的实例
- 如何实现 对输入框的文本内容进行限制的功能
- javascript 实现复制功能,选择页面内容
- Vue中使用Froala Editor时,外部方法调用html.insert()插入内容到光标最后停留位置功能实现
- vue实现的上传图片到数据库并显示到页面功能示例
- vue实现类似淘宝商品评价页面星级评价及上传多张图片功能
- 实现将Web页面的内容,Export To Excel的功能
- 原生js实现的局部页面打印功能,可以适用vue和jq
- Vue中使用Froala Editor时,外部方法调用html.insert()插入内容到光标最后停留位置功能实现
- js实现点击按钮出现输入框本地修改文字内容功能
- 实现输入内容提示的功能(仿google_百度输入框提示)jquery.ui.autocomplete.js插件
- vue基于两个计算属性实现选中和全选功能示例
- Vue中使用Froala Editor时,外部方法调用html.insert()插入内容到光标最后停留位置功能实现
- 页面输入框提示功能实现
- 实现功能:弹出一个DIV层提示等待信息,这个时候禁用用户操作页面中的其他内容
- 禁止选中页面内容-兼容ie、firefox、chrome