jQuery mobile の head タグと Wicket

Wicket Component#renderHead(org.apache.wicket.markup.html.IHeaderResponse)
をオーバーライドして、head を書き換えるとき、render 実行順で head に書かれる。
jQuery mobile を使うときの CSS , JavaScript の head 記述順番が、
以下のような順番である必要がある。

<link rel="stylesheet" href="jquery/jquery.mobile-1.0b3.min.css"/>
<script src="jquery/jquery-1.6.2.min.js"></script>
<script src="jquery/jquery.mobile-1.0b3.min.js"></script>


これに従うと Wicket Page クラスで renderHead をオーバーライドして書くとすれば、
DedaultPage.class のパッケージ配下に jQuery mobile のソース全て、images 画像も含めて
存在する場合、以下のように順番で記述する。


@Override
public void renderHead(IHeaderResponse response){
   super.renderHead(response);

   response.renderCSSReference(new PackageResourceReference(DedaultPage.class,"jquery.mobile-1.0b3.min.css"));
   response.renderJavaScriptReference(new PackageResourceReference(DedaultPage.class,"jquery-1.6.2.min.js"));
   response.renderJavaScriptReference(new PackageResourceReference(DedaultPage.class,"jquery.mobile-1.0b3.min.js"));
}

となる。(実際のHTML は、上記の場合、DedaultPage.class 配下で参照するように書き換わる)

ベースになる Page クラスをこれで用意するのも1つの方法である。