0

私は多くの同様の質問を見てきましたが、これに具体的に対処するものはありません.

Web アプリケーションの場合、多くの特定の動的「フラグメント」を (たとえば、現在のセッションのログイン ステータスなど) として設計しました。これらのフラグメントは、不完全な html (具体的には不完全な jsp ページ) として保存されます。html タグや body タグはありません。ただし、フラグメントが機能するために必要な javascript ファイルの CSS スタイルを設定します。

Fragment.jsp

<script type="text/javascript">
[...]code and functions to use ajax request to load current name using sessions
</script>

<div id="userProfile">
<H1>Current User:<span id="name">NONE GIVEN</span></H1>
</div>

目標は、JQuery を使用して現在のページにフラグメントをロードし、css を追加して右上の固定位置に保持することです。

  1. そのようなフラグメントを動的にロードするときの CSS について。このようなフラグメントが $("#someID").load() を使用して読み込まれると、含まれている CSS および JS リンクが現在のコンテナーに読み込まれ、html が無効になりますか?

  2. URL $("#someID").load("/fragments/Fragment.jsp #userProfile"); の選択を使用してフラグメントのみをロードし、css と js を動的にロードします。

コードをページに静的に追加することは避けるべきだと思います。なぜなら、フラグメントを使用するページの数が多くのページに変更を加える必要があり、管理不能なサイトにつながるからです。

4

1 に答える 1

0

これは別のばかげた質問のように思われるので、それに対する私の見解と、私が使用した解決策を示しましょう。Webデザインを始めたばかりなので、正しくない可能性があることに注意してください。

-サーバー側として Servlets/JSP で Tomcat を使用していますが、これはウィジェットの作成と使用には影響しません。

フラグメント.jsp

<div id="widget">
This contains the widget html. For the example here is a div to fill with data dynamically
<div id="dynamic"></div>
</div>

fragment.js

function initiateFragment(){
  $.get(aUrl,function(data){
    //callback goes here
    $("body").append(data);
    $("#dynamic").html(//dynamic content for the div);
    $("#widget").css(//Add any css here, don't include it to force modularity);
    //Since I needed a login widget, I added css to move the div out of document flow and to the top right
    });
}

これで、メイン ページで initializeFragment() を呼び出すだけで (fragment.js が含まれていることを確認してください)、フラグメントが読み込まれて表示されます。

于 2013-06-06T13:51:41.087 に答える