0

ページ間のナビゲーションに関して(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');
}); 
4

1 に答える 1

0

基本的にハッシュタグが行うことは、URL を同じ URL に設定することですが、それに #(ページ) を追加することです...最後に手動でアクセスしているページにハッシュを追加してみてください。ページは更新されません。 .

2 つのオプションがあります

オプション 1 - pushState の使用

これは長い話です。おそらく、pushState を使用するときにすべてのハッシュタグを削除するため、Web サイトとサーバー構造全体を変更する必要があります。

オプション 2 - ハッシュタグでホームを設定する

<a class="navigationTab" href="/#"><span>Home</span></a>

これを行うと、ルーターをホームに設定しますが、最後にハッシュタグが表示されます

于 2012-04-22T17:40:09.583 に答える