ページ間のナビゲーションに関して(Backbone.jsルーティングを使用して)アプリケーションを完全にajax化しようとしています。
したがって、基本的に必要なことはすべて実行し、ホームページを除いてページを更新せずにすべてのページが正しく読み込まれました。なぜこれが起こっているのかを特定しましたが、修正する方法がわかりません。以前にシングル ページ アプリを使用したことがある人にとっては、おそらく非常に単純な質問です。
したがって、基本的にはこれらのバックボーン ルートがあります。
routes: {
"": "renderHome",
"!/:page": "renderPage"
},
renderHome: function () {
pageView.render("Home");
},
renderPage: function (page) {
pageView.render(page);
}
Backbone PageView には次のような render メソッドがあります。
render: function (page) {
$(this.el).load("Navigation/" + page);
}
基本的に、/Navigation/anypage は ajax 経由で読み込まれますが (更新なし)、/Navigation/Home によってページが更新されます。
ただし、ホームページのアンカー FROM の href を単純に変更すると、次のようになります。
<a class="navigationTab" href=""><span>Home</span></a>
に:
<a class="navigationTab" href="#!/Home"><span>Home</span></a>
それは本来の方法で機能します。しかし、ホームページを www.website.com/#!/Home にしたくありません。
ホームページの元の形式 (ハッシュタグなし) を保持し、ページを更新せずに読み込むにはどうすればよいですか?
window.location.hash を空白の値に変更するとページがリロードされるためと思われますが、ハッシュタグがある場合はページの別の部分に移動するようなものであるため、リロードの必要はありません。どうすればこれを防ぐことができますか??
$('.navigationTab').click(function (event) {
event.preventDefault();
window.location.hash = $(this).attr('href');
});