1

現在、jquerymobile + phonegap アプリを試しています。私の質問は、jquerymobile フレームワークに焦点を当てています。

動的に (jsonp を介して) ロードされたページにスライド フェード トランジションを使用して変更したいのですが、ロードされたコンテンツをトランジションに表示したいと考えています。現在、移行を行っており、その後コンテンツが表示されます。(pagebeforeshow イベントを使用してデータを dom に追加しているためです。)

changePage イベントをトリガーする前に、jsonp を介してコンテンツをロードしました。だから私のデータはすでにそこにあります。次に、移行を実行する前に、そのデータを dom に配置する必要があります。jqm の changePage 関数でイベントをトリガーする適切な位置を見つけようとし、遷移の前にトリガーしました。ただし、コンテンツはトランジション内に表示されません。

それが私のリストをロードする方法です（それはうまくいきます）

function getList() {
    $.mobile.loading( 'show');
    var req = $.ajax({
    url : serviceURL + 'canteenParser2.php?type=getAllCanteens&callback=?',
    dataType : "jsonp",
    async : false,
    cache: false,
    timeout : 10000
});

req.success(function(data) {
    globalAjaxData = data;
    $.mobile.changePage('mensa.html',{showLoadMsg: false,
                         transition: 'slidefade'}
    );

});

req.error(function() {
    alert('Oh noes!');
});
}

そして、それがデータを表示する方法です：

function showList()
{
mensaList = globalAjaxData;
$.each(mensaList, function(index, mensa) {
    $('#mensaList').append('<li><a href="mensadetails.html?id=' + mensa.id + '" data-transition="slidefade">' +
                '' + mensa.name +  '</a></li>');
    });
$('#mensaList').listview('refresh');

}

現在、次のように showList() メソッドを呼び出しています。

$('#mensaListPage').live('pageshow',function(event){
    showList();
});

前述したように、たとえば pageload イベントと pagebeforeshow イベントを試しました。望ましい動作を実装する方法について誰か提案がありますか?

こんにちはモリッツ

アップデート

ajax 読み込み呼び出しの後、遷移の前に showList Methode を呼び出す必要があることがわかりました。

$$('#mensaListPage').live('pagebeforeshow',function(event){
showList();
});

これは、スライド トランジションでは機能しますが、スライド フェード トランジションでは機能しません。(しかし、私のモバイル アプリではスライド トランジションがちらつきます。そのため、slidefade を使用しました。)

うまくいけば、問題の1つを解決する機会があります。;)

4

1 に答える 1

0

jsonpリクエストは同期操作をサポートしていません。

2番目のページにデータをロードします。うまくいきます。

于 2013-02-25T02:55:02.653 に答える