移动端input和ios的问题

<input unselectable="on" onfocus="this.blur()" id="ticket" type="text" placeholder="请选择票据类型" :value="ticketType" readonly="readonly">
 
 
 unselectable="on" onfocus="this.blur()" 解决移动端IOS的input框只读状态还有光标的问题
 
 
<input id="phone" type="tel" pattern="[0-9]*" placeholder="请输入手机号码" v-model="phone" onkeyup="phoneType">
 
onkeyup时间解决浏览器不能限制字符数量,函数phoneType限制了只能输入数字
phoneType 
phoneType(a){
let v = this.phone;
if (v) {
this.phone = v.replace(/\D/g, '');
if (v.length > 11) {
this.phone = v.slice(0, 11);
}
};
 
解决了ios端输入框有焦点了 整体都放大的问题
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
 
 
posted @ 2018-01-25 13:49  zzzzhang  阅读(2005)  评论(0编辑  收藏  举报