2013-10-09 65 views
0

我注意到,當你專注於表單元素和改變方向時,iOS設備會鎖定你網站的視圖。設備朝向時如何失去輸入焦點?

我想知道是否有辦法修改已執行的代碼,以包含丟失的功能<input> & <select>重點是定位風景還是肖像?

這裏是我已經代碼:

// Fix HTML width issues on device orientation 

window.document.addEventListener('orientationchange', function() { 
    var iOS = navigator.userAgent.match(/(iPad|iPhone|iPod)/g); 
    var viewportmeta = document.querySelector('meta[name="viewport"]'); 
    if (iOS && viewportmeta) { 
    if (viewportmeta.content.match(/width=device-width/)) { 
     viewportmeta.content = viewportmeta.content.replace(/width=[^,]+/, 'width=1'); 
    } 
    viewportmeta.content = viewportmeta.content.replace(/width=[^,]+/, 'width=' + window.innerWidth); 
    } 
    // If you want to hide the address bar on orientation change, uncomment the next line 
    window.scrollTo(0, 0); 
}, false); 

任何幫助將不勝感激,謝謝

回答

0

尤里卡!

window.document.addEventListener('orientationchange', function(){ 
    if (window.orientation === 90 || window.orientation === -90){ 
     document.activeElement.blur(); 
    } 
    else if(window.orientation === 0) { 
     var viewportmeta = document.querySelector('meta[name="viewport"]'); 
     viewportmeta.content = viewportmeta.content.replace(/width=[^,]+/, 'width=' + window.innerWidth); 
    } 
    window.scrollTo(0, 0); 
}, false);