h5通过css实现禁止ios端长按复制选中文字的方法

在ios端默认的长按选择,可以对文字进行复制粘贴。但是在实际开发中,针对一些按钮一般要避免长按时弹出选中文字,或者一些罩层要避免弹出。 这篇文章通过css3实现禁止ios端长按复制选中文字的方法。

 

css代码如下:

*{
-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;
}

  

Pexelshttps://www.wode007.com/sites/73241.html 天堂图片网https://www.wode007.com/sites/73243.html

但是IOS上出现input、textarea不能输入,因此将使用-webkit-user-select:auto;如下:

input,textarea {
    -webkit-user-select:auto; /*webkit浏览器*/
    margin: 0px;
    padding: 0px;
    outline: none;
}

  

这样就避免了苹果手机上会导致input输入框不能聚焦从而不能输。当然一般不要轻易使用通配符*{}的方式,我们可以给定对应class名称。

h5通过css实现禁止ios端长按复制选中文字的方法

上一篇:uinApp nvue如何使用阿里图标iconfont


下一篇:uinApp nvue如何使用阿里图标iconfont