小ネタ:jQuery Mobile ヘッダの戻るボタン

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

小ネタです。

http://dev.screw-axis.com/doc/jquery_mobile/components/toolbars/header_bars/によると、jQuery Mobileでは、フレームワークが自動的にヘッダに戻るボタンを付けるとあります。 実際にいくつかページを作って遷移する画面を作ってみたのですが、戻るボタンは自動で表示されませんでした。(何かミスってる?)

分からなかったので強制的に出す方法はないかなと調べてみたら、おまじないで出るようになりました。 jquery.mobile-1.0.min.jsをロードする前に、$.mobile.page.prototype.options.addBackBtn = true;を設定します。 こんな感じです。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
	$(document).bind("mobileinit", function() {
		$.mobile.page.prototype.options.addBackBtn = true;
	});
</script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

戻るボタンが自動的に表示されなかったら、使ってみてください。