# 常见的移动端问题

  • 有时因为服务器或者别的原因导致页面上的图片没有找到

    	```js
    	用一个本地图片来替代
    	<img src="images/logo.png" onerror="nofind();" />
    
    	<script type="text/javascript">
    	function nofind(){
    		var img=event.srcElement;
    		img.src="images/logoError.png";
    		img.onerror=null; //控制不要一直跳动
    	}
    	</script>
    
    	```
    
  • 移动端手机号码识别(IOS) 在 iOS Safari (其他浏览器和 Android 均不会)上会对那些看起来像是电话号码的数字处理为电话链接,比如: • 7 位数字,形如:1234567 • 带括号及加号的数字,形如:(+86)123456789 • 双连接线的数字,形如:00-00-00111 • 11 位数字,形如:13800138000 可能还有其他类型的数字也会被识别。我们可以通过如下的 meta 来关闭电话号码的自动识别: <meta name="format-detection" content="telephone=no" /> 开启电话功能 <a href="tel:123456">123456</a> 开启短信功能: <a href="sms:123456">123456</a>

  • 移动端邮箱识别(Android) 与电话号码的识别一样,在安卓上会对符合邮箱格式的字符串进行识别,我们可以通过如下的 meta 来管别邮箱的自动识别: <meta content="email=no" name="format-detection" /> 同样地,我们也可以通过标签属性来开启长按邮箱地址弹出邮件发送的功能: <a mailto:dooyoe@gmail.com">dooyoe@gmail.com</a>

  • ios 系统中元素被触摸时产生的半透明灰色遮罩怎么去掉 ios 用户点击一个链接,会出现一个半透明灰色遮罩, 如果想要禁用,可设置 -webkit-tap-highlight-coloralpha 值为 0,也就是属性值的最后一位设置为 0 就可以去除半透明灰色遮罩。 {-webkit-tap-highlight-color: rgba(0,0,0,0;)}

  • webkit 表单元素的默认外观怎么重置 .css{-webkit-appearance:none;}

  • 移动端禁止选中内容 如果你不想用户可以选中页面中的内容,那么你可以在 css 中禁掉:

.user-select-none {
  -webkit-user-select: none;/text
}
  • 如何禁止保存或拷贝图像(IOS) 通常当你在手机或者 pad 上长按图像 img ,会弹出选项存储图像 或者拷贝图像,如果你不想让用户这么操作,那么你可以通过以下方法来禁止: img { -webkit-touch-callout: none; }
上次更新: 10/29/2019, 6:04:16 PM