input輸入框失去焦點,頁面視覺回彈,但實際並沒回彈,添加blur事件
在移動端,當點擊輸入框時,彈出軟鍵盤,頁面被頂上去一截,當輸入完畢失去焦點,軟鍵盤關閉時,頁面彈回彈回恢復正常(這裏關閉軟鍵盤,頁面沒有彈回的參考 https://blog.csdn.net/MtangEr/article/details/86552257 ),但是頁面上的按鈕綁定的一些事件就不能觸發,如點擊事件;
其中原因是,我們從視覺上看上去頁面彈回。你點擊的也是按鈕的位置,但是實際上,頁面按鈕的位置還是保留在鍵盤彈出,頁面頂上去的那個按鈕的位置(不信不可以操作試試)
這時就需要添加blue事件。
1、jquery 綁定blur事件的寫法
<input type="text" class=“name”></li>
$(".name").blur(function(){
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
});
2.vue 添加綁定blur事件的寫法
<input type="text" @blur="viewDefault" ></li>
viewDefault: function() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
},