6

以下の AJAX コードを使用して、別の HTML ファイルのコンテンツをインデックス ページに追加しています。AJAX は正しく機能し、コンテンツは表示されますが、CSS でコーディングしたスタイルが AJAX の実行後に適用されません。

問題の解決策を探してネットを検索してきましたが、これまで試した解決策はうまくいきませんでした。以下では、.trigger('create') を使用して、追加しているコンテンツの CSS を強制的に更新しようとしていますが、機能していません。ブラウザーから手動でページを更新すると、スタイルが適用されます。AJAX の実行後にページ全体を更新せずにスタイルを更新する方法について、誰かが正しい方向に向けることができますか?

$.ajax({ type: "GET",   
    url: pageToLoad,   
    async: false,
    success : function(data)
    {
        $(data).find('#'+divID).appendTo('#contentcontainer').trigger('create');
    }
});

インデックス ページに追加される HTML:

<div class="content" id="portfolio">
    <div class="wrapper">
         <h2>Portfolio</h2>
             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum libero non egestas dapibus. Nam gravida, libero ac posuere eleifend, mauris nisi venenatis metus, non hendrerit magna justo eget lectus.</p>
    </div><!--wrapper-->
    <div class="clear"></div>
</div><!--content-->

default.css に適用される CSS スタイル:

#index {background-color:#82e4e5;}
#portfolio {background-color:#fb5656;}
4

2 に答える 2

1

これを試しましたか?

$.ajax({ type: "GET",   
    url: pageToLoad,   
    async: false,
    success : function(data)
    {
        $(data).find('#'+divID).appendTo('#contentcontainer').trigger('create');
        $('#index').css( "backgroundColor", "#82e4e5" );
        $('#portfolio').css( "backgroundColor", "#fb5656" );
    }
});
于 2013-09-06T02:34:35.777 に答える
1

AJAX 呼び出しの後にスタイルを更新する必要はありません。例としてjsFiddleを作成できますか?

私のために働くjsFiddleを作成しました。しかし、挿入する HTML を . で囲む必要がありましたdiv.trigger('create')コードも外しました。

于 2013-09-06T02:59:11.003 に答える