在APP中ios輸入賬號和密碼時鍵盤閃爍


在APP中 ios手機 用戶打開默認的自動識別密碼,會出現調起鍵盤輸入密碼時 鍵盤一直閃爍的bug

解決方法:1用戶在ios系統的設置中 自己關閉自動識別密碼 (這種問題建議還是開發解決吧,用戶體驗不好,,,)

第二種解決方法:

下面以vant組件使用為例

這是一個登陸頁 一開始這樣寫就  用戶打開默認的自動識別密碼,會出現調起鍵盤輸入密碼時 鍵盤一直閃爍的bug

<section class="login-bar">
  <div class="login-input van-hairline--bottom">
    <van-field v-model="phone" type="tel" clearable maxlength="11" placeholder="請輸入您的ID或手機號" :border="false"
      size="large"  autocomplete="off" />
  </div>
  <div class="login-input van-hairline--bottom">
    <van-field class="p-input" v-model="password" maxlength="16" :type="inputType" clearable placeholder="請輸入您的密碼"
      :border="false" size="large"  autocomplete="off"/>
  </div>
</section>

解決方法就是 在第一個輸入框也就是輸入手機號的輸入框下面加一個輸入框並隱藏  在輸入密碼的輸入框上方加一個輸入框隱藏 即可解決

給類名hide-input   加上樣式:  這樣即可

.hide-input {
  width:0;
  opacity:0;
}
<section class="login-bar">
  <div class="login-input van-hairline--bottom">
    <van-field v-model="phone" type="tel" clearable maxlength="11" placeholder="請輸入您的ID或手機號" :border="false"
      size="large"  autocomplete="off" />
      // 下方添加輸入框
    <van-field v-model="phone" type="tel" clearable maxlength="11" placeholder="請輸入您的ID或手機號" :border="false"
    size="large"  autocomplete="off"  class="hide-input"/>
  </div>
  <div class="login-input van-hairline--bottom">
  //上方添加輸入框
    <van-field class="hide-input" style="display:none" v-model="password" maxlength="16" :type="inputType" clearable placeholder="請輸入您的密碼"
      :border="false" size="large"  autocomplete="off" />
    <van-field class="p-input" v-model="password" maxlength="16" :type="inputType" clearable placeholder="請輸入您的密碼"
      :border="false" size="large"  autocomplete="off"/>
  </div>
</section>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM