解決ios環境下點擊輸入框頁面被頂起不能自動回彈到底部問題


第一步:在標簽的輸入框中添加獲取焦點事件  代碼寫法: @focus="getFocus" (vue代碼)  可直接拷貝拿去放在自己頁面元素中,如下:

 <div class="o-field o-grid__cell carinfo-grid__cell">
            <input
              @blur="onPlaceholderMobleBlur"
         @focus="getFocus" :value="holderMobile" class="c-field" type="text" placeholder="請輸入投保人手機號" maxlength="11"> </div>

第二步:在methods 方法中聲明 獲取焦點事件 如下寫法,下面代碼直接拷貝即可

 methods: {
    getFocus() {
      $("input,textarea").on("blur", function() {
        window.scroll(0, 0);
      });
    },

這里引入jQuery(jQuery還是很好用的)

實現原理:
      原理就是彈起鍵盤的時候,window.scrollY會從0變到鍵盤的高度(例如:200),當輸入框焦點失去后讓scrollY回到0就好了

或者 這么寫只是不需要引入jQuery了

1  window.addEventListener('focusout', function () {
2       document.body.scrollTop = document.body.scrollHeight;
3  })

 

<div class="o-field o-grid__cell carinfo-grid__cell">
<input
@blur="onPlaceholderMobleBlur"
:value="holderMobile"
class="c-field"
type="text"
placeholder="請輸入投保人手機號"
maxlength="11">
</div>


免責聲明!

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



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