1

私はこれをしばらく見ていて、明らかな何かが欠けているように感じます...

jQuery mobileを使用してWebアプリのユーザーのダイアログをポップアップし、ユーザーエージェントスニッフィングを使用して、プラットフォームに基づいて選択した場合にアプリのインストール方法をユーザーに指示するクイックダイアログを提供しています。

それは問題ではないように思われるかもしれませんが、私は自分の基地を可能な限りカバーするようにしたいです。最後のifステートメントは、幅が600ピクセル未満で、以前のua文字列のいずれも含まれていないブラウザーに適用されます...したがって、Chromeのデスクトップインストールを減らすと、そのポップアップがトリガーされます。ただし、Chromeでは表示され、すぐに消えます。スローされたエラーが表示されず、Firefoxでエラーが発生していないため、何が発生しているかがわかりません。

2つの質問があります:

1-ここで何が起こっているのか誰か知っていますか?私は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とjQueryMobileライブラリをリンクすると、すべてが正常に機能します(最後の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ではない)でページの読み込み時に条件付きでポップアップを開いた場合にも、この問題が発生しました。修正により、ライブラリがjqm1.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 に答える