では、実際に初期化を行ってみましょう。まずは、ページの初期化からです。これは、「pagecreate」というイベントとして用意されています。$(document).bindでpagecreateに関数をバインドし、その中で初期化処理を行なう形になるでしょう。

下のリスト欄に簡単なサンプルを挙げておきます。これは、<a>タグのボタンをレンダリングする例です。<a>タグは、data-role="button"を設定することでボタンとして表示できますが、いちいちこれを書かないといけないのは面倒臭いですね。そこで、<a>タグをすべて初期化時にレンダリングするようにしてみました。

ここでは、まず$(document).bindでpagecreateに関数をバインドするのでしたね。これは以下のようなかた地で記述されます。

$(document).bind("pagecreate", function(){……略……});

これで、第２引数の関数定義で初期化処理を記述しておけば良いわけです。今回の「<a>タグを全部ボタンにレンダリングする」というのは、以下のようにしています。」

$('a').buttonMarkup({ corners: false, theme:"b"});

buttonMarkupは、以前、リンクのイネーブル状態を操作したりするのに紹介しました。が、このように<a>タグにボタンのレンダリングを実行するのにも用いられます。引数には、レンダリングする際の設定情報を連想配列でまとめてあります。今回は「corners」と「theme」という値を用意してみました。cornersは、角の丸みに関するもので、trueにすると丸みを付け、falseだとつけません。themeはテーマに関するもので、デフォルトでは「a」～「e」のテーマ（正確にはスウォッチといいます）を指定します。

実際にやってみるとわかりますが、<a>タグのボタンは角の丸みがないブルーグレーの表示になりますが、普通の<input type="button">のボタンはそのままです。ボタンがみんな変わるわけではないのですね。