h5短信验证码自动填充时总是被复制两遍(系统bug)

 

 

现象:ios、部分安卓系统短信自动填充会复制2次

原因:是系统bug,复制验证码会触发UITextFieldTextDidChangeNotification监听事件,导致验证码出现了两次。

解决办法:直接限制input最大输入maxlength=6
下面是vant的输入框写法

复制代码
        <van-field
          v-model="mobilePhone"
          error-message="请填写短信验证码"
          class="field"
          required
          center
          clearable
          placeholder="请输入短信验证码"
          :border="false"
          type="digit"
          maxlength=6
        >
复制代码
如果input框的type=“text” 或者 type=“password”,则可以给input框加上maxLength属性,让最大长度等于验证码的位数。
如果input框的type=“number”,则可以用如下方法解决:

<input type="number" oninput="if(value.length>6) value = value.slice(0,6)">

 




posted @   木杉呀  阅读(1672)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
点击右上角即可分享
微信分享提示