Android WebView在高清手机上单击链接(加载新页面时)后会缩放

Question

我有一个Android应用程序，它使用Cordova和WebView来显示从远程Web服务器加载的内容（主要是PHP/Zend生成的静态页面）。

我知道的所有方法都禁用了 Web 内容的缩放（因为 PHP 根据应用程序发送的分辨率生成布局），但在高清手机（320/480DPI;例如 Samsuns S3/Note、HTC one 等）上，当用户单击链接以加载新页面时，旧页面的内容会放大，而 WebView 等待服务器的响应（不到 1 秒，但看起来仍然很烦人）。

视口设置为不带缩放的设备分辨率：

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

或如 Zend 中所定义：

$view->headMeta()->appendName('viewport', 'initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi');

网络视图的缩放也被禁用（在APK的初始活动中）：

appView.getSettings().setSupportZoom(false);
appView.getSettings().setBuiltInZoomControls(false);
appView.getSettings().setUseWideViewPort(false);

还有几个JS库（google-analytics，jQuery 1.9.1，jQuery UI，Photoswipe for jQuery 3.0.5），所以我不确定它们中的任何一个是否可能导致这种情况。

任何提示可能导致这种情况的原因是什么？

PS：作为最终解决方案，我正在考虑在onUnload处理程序中隐藏页面的内容，但是我想知道为什么我必须做如此激进的事情。

Answer 1

还没有，

所以我至少会发布我是如何解决问题的（以防有人碰巧有类似的问题）。

/**
 * disables default link redirect; shows splash screen and redirects after few milliseconds
 *
 * @param  event {Event/String} either event from user action (then 'this' must be an anchor <A>) or URL for manual redirect
 */
linkRedirect = function(event) {
    var
        curHref = document.location.href,
        newHref = this.href;
    if ('string' === typeof event) {
        newHref = event;
        event = null;
    }
    if ('string' === typeof newHref && !newHref.match('^mailto:')) {
        (event && event.preventDefault ? event.preventDefault() : undefined); //stop default browser link redirect
        curHref = curHref.split('#');  //separate URL path (part that is send to server) and hash (part only for browser)
        newHref = newHref.split('#');
        if ('' !== newHref[0] && curHref[0] !== newHref[0]) { //new URL has different server path - redirect (if newHref[0] is empty, it means on Hash was passed)
            navigator.splashscreen.show(); //show splash
            $('body').height();   //force browser to update DOM by reading a CSS property
            mv.user.redirectTo.defer(100, this, [newHref.join('#')]); //allow the DOM to redraw and then redirect
        }
        else if (newHref[1] && curHref[1] !== newHref[1]) { //new URL has different only the hash - change it (link <a href="#"> is reserver for onclick handler and is ignored!!!)
            document.location.hash = newHref[1];
        }
    } //else no HREF on this link - ignore it
};
/**
 * Loads page from given URL into current document
 *
 * @param  link {String}
 */
redirectTo = function(link) {
    document.location.href = link;
};
/**
 * Disable default form submission; shows splash screen and submits data after few milliseconds
 *
 * @param  event {Event} event for user action
 * @return {Boolean} returns false to prevent default submission
 */
formSubmit = function(event) {
    (event && event.preventDefault ? event.preventDefault() : undefined);
    navigator.splashscreen.show(); //show splash
    $('body').height();   //force browser to update DOM by reading a CSS property
    $('<form>')[0].submit.defer(100, this); //allow the DOM to redraw and then redirect
    /* form.submit should be a method to submit the form, but in case some form element (usually the submit button)
     * has ID="submit", then form.submit contains reference to the element (button) and there is no way to manually
     * submit the button (and form.submit.click() cannot be used as it would only create recursion).
     *
     * Workaround is to create new empty Form and use its submit method called on the correct scope.
     */
    return false; //same as prevent default (for case event is missing)
};
$(document).on('click', 'a', linkRedirect); //watch for clicks on links and hide page content before redirect
$(document).on('submit', 'form', formSubmit); //watch for form submissions and hide page content before submitting