移动端input和ios的问题

• Z时代
• 2024-01-10
• 分类：综合

<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">

以上是 移动端input和ios的问题 的全部内容， 来源链接： utcz.com/z/508734.html