1

我已经看了一段时间，觉得我错过了一些明显的东西......

我正在使用 jQuery mobile 为 Web 应用程序的用户弹出一个对话框，我正在使用用户代理嗅探来提供一个快速对话框，以指导用户根据他们的平台选择如何安装应用程序。

虽然这似乎无关紧要，但我想确保我尽可能地覆盖我的基础。最后一个 if 语句适用于宽度小于 600 像素且没有先前 ua 字符串之一的浏览器……因此，如果您减少 Chrome 的桌面安装，它将触发该弹出窗口。但是，在 Chrome 中它会出现然后立即消失。我看不到任何抛出的错误，因为我没有看到它在 Firefox 中发生，所以我没有看到发生了什么。

我有两个问题：

1 - 有谁知道这里发生了什么？我尝试过返回 false 和不返回 false，我认为这无关紧要，只是为了测试逃生。

2 - 有没有人建议做这个清洁剂。由于我正在测试 ua，因此我正在考虑尝试将其作为 switch 语句运行，但我不确定测试是否能正常工作......但我觉得我并没有把头绕在右边方法。

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1;
var isWinPhone = ua.indexOf("windows phone") > -1;
var isBlackberry = ua.indexOf("blackberry") > -1;
var isbbTen = ua.indexOf("bb10") > -1;
var current_width = $(window).width();
$( '#home' ).live( 'pageinit',function(event){
if(isAndroid) {
$.mobile.changePage( '#android' , { transition:"pop", role:"dialog" });
return false;
};
if(isWinPhone) {
$.mobile.changePage( '#winPhone' , { transition:"pop", role:"dialog" });
return false;
};
if(isBlackberry) {
$.mobile.changePage( '#Blackberry' , { transition:"pop", role:"dialog" });
return false;
};
if(isbbTen) {
$.mobile.changePage( '#bbTen' , { transition:"pop", role:"dialog" });
return false;
};
if(current_width < 599 && !isAndroid && !isWinPhone && !isBlackberry && !isbbTen){
$.mobile.changePage( '#generic' , { transition:"pop", role:"dialog" });
return false;
};
});

您可以在这里看到同样的事情：http: //jsfiddle.net/fskirschbaum/2YTwE/1/如果您在 Chrome 中查看它。

我已经尝试了一些其他参数，但不明白为什么会发生这种情况，我不知道从哪里开始。

4

3 回答 3

2

我也有一个消失的对话框问题 - 原来与早期尝试摆脱“闪烁”有关 - 一个 SO 答案表明以下将停止闪烁（它没有）：

.ui-page { -webkit-backface-visibility: hidden; }

当我删除这行 css 时，对话框工作正常。

于 2013-09-19T15:24:37.607 回答
1
  1. 如果您链接正确的 jQuery 和 jQuery Mobile 库，一切都会正常工作（请参阅最后的 jsFiddle）。
  2. 这个实现怎么样
$('#home').on('pageinit', function(){
    var ua = navigator.userAgent.toLowerCase(),
        page = '', 
        role='dialog';

    switch(true) {
        case (ua.indexOf("android") > -1):
            page = '#android';
            break;
        case (ua.indexOf("windows phone") > -1):
            page = '#winPhone';
            break;
        case (ua.indexOf("blackberry") > -1):
            page = '#Blackberry';
            break;
        case (ua.indexOf("bb10") > -1):
            page = '#bbTen'; 
            break;
        case ($(window).width() < 599):
            page = '#generic';
            break;
    }
    if (page.length) {
        $.mobile.changePage(page, {transition:'pop', role:role});
        return false;
    }    
});

这里正在工作jsFiddle

于 2013-02-27T03:10:34.490 回答
0

我也遇到了这个问题，如果我在加载页面时有条件地打开了一个弹出窗口，在 Chrome 浏览器中（不是在 FF 中）修复结果是将库更新到 jqm 1.3.1。

而已。在 FF 和 Chrome 中测试。

请注意，jsfiddle.com 上作为选项提供的 1.3.0b 不起作用。1.3.1 可以。

然后绑定到 pageshow 事件：

jQuery(document).on ( 'pageshow', function(event) {
    $( '#popupID' ).popup('open'); 
});
于 2013-05-07T17:12:55.280 回答