移动端禁止/阻止/取消长按进行复制粘贴的操作

最近的项目要求实现一个长按添加关注的功能,后来功能做好了,但是安卓手机长按的时候居然会在周边随便选中文字弹出自带的复制粘贴的操作,后来在网上搜了个样式控制的方法:

*{
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

以为ok啦,结果项目一上线,业务方提出ios手机有问题啦,所有的输入框自动失去焦点无法输入内容,后来经过查找,发现了一个问题,是因为 -webkit-user-select:none; 这个属性造成的,然后在同一个css文件中加个样式就解决了:

input , textarea{
	-webkit-user-select:auto;
}

其实后来在测试过程中发现ios手机还是有问题,最后无奈,我只能在页面上判断当前手机是安卓还是ios然后,调用不同的css文件,在安卓手机调用的css文件里加入以下样式就可以了

*{
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

你可能感兴趣的:(css样式)