0

ドキュメントに 2 ページあります。アクティブなページにリストが表示され、リストをクリックすると、2 番目のページが表示されます。2 番目のページのcontentdiv は、JS のカスタム css と共に動的に追加されます。以下の Java スクリプトはこのジョブを実行しますが、css レンダリングを取得できません。

   $("#showmore").live("click", function(event, param1){       
        getUrl = $(this).attr('data-href');
        $.post(getUrl, function(data){  
            $.mobile.hidePageLoadingMsg(); 
            $('#more').html(data);
            $.mobile.activePage.page().trigger('refresh');
        });    
    });    

私も試してみ$.mobile.activePage.trigger('create');ました.これは機能しますが、2つのページを行ったり来たりします. しかし、リストを2回目にクリックすると、コンテンツがまったくレンダリングされません。ヘッダーだけの空白のページです。

css を使用して動的コンテンツをセカンダリ ページに追加し、同じページから何度でも表示する方法について、専門知識を共有できますか?

4

2 に答える 2

1

.trigger('create')置き換える要素を呼び出すだけです。

$("#showmore").live("click", function(event, param1){       
    var getUrl = $(this).attr('data-href');//don't unnecessarily create global vars
    $.post(getUrl, function(data){  
        $.mobile.hidePageLoadingMsg();

        //since you are only changing this HTML, you only have to initialize this HTML
        $('#more').html(data).trigger('create');
    });    
});

これが機能していないように見える状況に遭遇しましたが、次のように各タイプのウィジェットを個別に初期化することに成功しました。

$("#showmore").live("click", function(event, param1){       
    var getUrl = $(this).attr('data-href');//don't unnecessarily create global vars
    $.post(getUrl, function(data){  
        $.mobile.hidePageLoadingMsg();

        $('#more').html(data).find('a[data-role="button"]').button().end()
                             .find('ul[data-role="listview"], ol[data-role="listview"]').listview().end()
                             ...
    });    
});

これは、HTMLをDOMに動的に追加し、jQuery MobileにHTMLのウィジェットを初期化させるデモです:http://jsfiddle.net/csKtX/

また、data-role="button"ウィジェットに(など)を追加していることを確認して、jQuery Mobileがウィジェットを初期化することを認識できるようにします(上記の私のコードは、ウィジェットを初期化したことを前提としています)。

于 2012-04-19T21:10:27.380 に答える
0

最近、動的コンテンツが Firefox でレンダリングされない jQuery で同様の経験がありました。私は自分のサイトを機能させましたが、問題は次の行にあると思います: $('#more').html(data);

それを innerHTML メソッドに置き換えてみて、それが機能するかどうかを確認してください。

乾杯

于 2012-04-19T21:21:38.443 に答える