iso移動端input的bug解決(vue)


iso中input很奇怪,點擊空白地方,鍵盤也不會消失,影響頁面中其他功能

解決辦法: 點擊的元素不是input或者textarea,那么就讓上一個獲得焦點的輸入框失去焦點。

涉及的代碼:

<input type="tel" @focus="isohide($event)">

var iso = false;
var nowinput = null;
var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return {
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
};
if(browser.versions.ios){
iso = true;
}
function docTouchend (event){
if (!(event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA')) {
setTimeout(function(){
nowinput.blur();
window.scrollBy(0,10); // 解決失去焦點后,蘋果的頁面窗口可能卡住,讓滾動條滾動一點即可。
document.removeEventListener('touchend', docTouchend,false);
}, 300);
}
};

vue中methods
methods: {
 isohide: function (e) {
if (iso) {
nowinput = e.target;
document.addEventListener("touchend", docTouchend, false);
}
}
}


免責聲明!

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



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