jQuery動的読み込みhtml

898 ワード

従来、jqueryを使用する過程で、ある情報を動的にロードする必要がある場合、一般的な処理方法はactionで情報をクエリーし、jsonでjspページに戻り、ページでjavascriptを使用して指定したスタイル、例えば表をつづる.このパッチワークの過程は煩わしいし、特に間違いやすく、デバッグも面倒です.
こんなに面倒なのは、jqueryに慣れていないからです.jqueryには、actionの実行結果を指定したhtml要素、例えばdivに動的にロードできるloadメソッドがあることがわかりました.そこで、以前のプログラムを書き換えることができて、情報を取得する時、依然として伝統的な方法を採用して、つまりstruts 2のactionを通じて情報を取得して、それからあるページの表示情報にジャンプして、私達はこのページの中でスタイルを設定することができて、実はこのページは普通のjspページで、中でstruts 2のラベルを通じてデータを表示します.次に、以前のajaxメソッドをloadに変更します.
例は次のとおりです.
前に動的情報を表示したdivのidがdetailInfoである場合
<div id="detailInfo">
</div>

ajaxメソッドを次のように書くことができます.
 
$("#detailInfo").load("<%=request.getContextPath()%>/namespace/action.action?id=${id}");

  この処理後、jqueryはactionの実行結果をdetailInfoのdivに表示します.これにより、動的に情報を取得する目標を達成するとともに、コードの概要を維持し、スタイルを簡単に定義することができます.