HTML5对手机页面长按会粘贴复制禁用的解决方法


Posted in HTML / CSS onJuly 19, 2016

解决方法如下所示:
 
 直接在CSS 文件中添加下面的代码,就可以实现了在手机端禁止粘贴复制的功能:

XML/HTML Code复制内容到剪贴板
  1. *{   
  2.     -webkit-touch-callout:none;  /*系统默认菜单被禁用*/   
  3.     -webkit-user-select:none; /*webkit浏览器*/   
  4.     -khtml-user-select:none; /*早期浏览器*/   
  5.     -moz-user-select:none;/*火狐*/   
  6.     -ms-user-select:none; /*IE10*/   
  7.     user-select:none;   
  8. }  

在添加完这段代码后,在IOS 上会有问题的,这个时候你会发现input 框无法正在输入了内容了;造成这个原因就是 -webkit-user-select:none; 这个属性造成的。

解决这个方法 就是 在css 文件中同时设置一下input 的属性,如下所示:

XML/HTML Code复制内容到剪贴板
  1. input {      
  2.      -webkit-user-select:auto; /*webkit浏览器*/     
  3. }  

这样就可以了,有什么不正确的地方请大神,指点出来;相互学习,互相进步!

HTML / CSS 相关文章推荐
纯CSS3实现Material Design效果
Mar 09 HTML / CSS
8款精美的CSS3表单设计(登录表单/下拉选择/按钮附演示及源码)
Feb 04 HTML / CSS
基于CSS3特效之动画:animation的应用
May 09 HTML / CSS
css3使网页、图片变成灰色兼容大多数浏览器
Jul 02 HTML / CSS
CSS3中的transform属性进行2D和3D变换的基本用法
May 12 HTML / CSS
CSS3贝塞尔曲线示例:创建链接悬停动画效果
Nov 19 HTML / CSS
HTML5响应式(自适应)网页设计的实现
Nov 17 HTML / CSS
详解HTML5 录音的踩坑之旅
Dec 26 HTML / CSS
基于Html5 canvas实现裁剪图片和马赛克功能及又拍云上传图片 功能
Jul 09 HTML / CSS
amazeui 验证按钮扩展的实现
Aug 21 HTML / CSS
巧用 -webkit-box-reflect 倒影实现各类动效(小结)
Apr 22 HTML / CSS
HTML5 Web 存储详解
Sep 16 #HTML / CSS
HTML5移动开发图片压缩上传功能
Nov 09 #HTML / CSS
纯HTML5+CSS3制作生日蛋糕代码
Nov 16 #HTML / CSS
HTML5地理定位与第三方工具百度地图的应用
Nov 17 #HTML / CSS
解决img标签上下出现间隙的方法
Dec 14 #HTML / CSS
HTML5-WebSocket实现聊天室示例
Dec 15 #HTML / CSS
详解HTML5通讯录获取指定多个人的信息
Dec 20 #HTML / CSS
You might like
PHP利用COM对象访问SQLServer、Access
2006/10/09 PHP
PHP时间戳使用实例代码
2008/06/07 PHP
php实现网站文件批量压缩下载功能
2015/10/28 PHP
yii实现使用CUploadedFile上传文件的方法
2015/12/28 PHP
php上传图片生成缩略图(GD库)
2016/01/06 PHP
PHP中的数组处理函数实例总结
2016/01/09 PHP
PHP中散列密码的安全性分析
2019/07/26 PHP
JavaScript获取GridView中用户点击控件的行号,列号
2009/04/14 Javascript
JS 判断undefined的实现代码
2009/11/26 Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
2015/03/03 Javascript
多个js毫秒倒计时同时进行效果
2016/01/05 Javascript
js代码延迟一定时间后执行一个函数的实例
2017/02/15 Javascript
微信小程序 flex实现导航实例详解
2017/04/26 Javascript
如何使用angularJs
2017/05/08 Javascript
js实现首屏延迟加载实现方法 js实现多屏单张图片延迟加载效果
2017/07/17 Javascript
微信小程序实现弹出层效果
2020/05/26 Javascript
vue父子组件的通信方法(实例详解)
2019/11/10 Javascript
vue使用prop可以渲染但是打印台报错的解决方式
2019/11/13 Javascript
vue实现分页的三种效果
2020/06/23 Javascript
[00:32]2018DOTA2亚洲邀请赛Mineski出场
2018/04/04 DOTA
使用python telnetlib批量备份交换机配置的方法
2019/07/25 Python
python实现京东订单推送到测试环境,提供便利操作示例
2019/08/09 Python
如何在VSCode上轻松舒适的配置Python的方法步骤
2019/10/28 Python
python绘制雷达图实例讲解
2021/01/03 Python
IE10 Error.stack 让脚本调试更加方便快捷
2013/04/22 HTML / CSS
丝芙兰法国官网:SEPHORA法国
2016/09/01 全球购物
世界上最好的精品店:Shoptiques
2018/02/05 全球购物
联想香港官方网站及网店:Lenovo香港
2018/04/13 全球购物
L’AGENCE官网:加州女装品牌
2018/06/03 全球购物
Notino法国:购买香水和化妆品
2019/04/15 全球购物
医院总经理职责
2013/12/26 职场文书
珍惜资源保护环境的建议书
2014/05/14 职场文书
三八红旗手事迹材料
2014/12/26 职场文书
体育教师研修感悟
2015/11/18 职场文书
2016年度创先争优活动总结
2016/04/05 职场文书
python基础之//、/与%的区别详解
2022/06/10 Python