3

最初のページから [キャンセル] をクリックすると、問題ありません。しかし、「2 ページ目」に移動するときに「キャンセル」が機能しません。この場合、ルーターはアプリケーションを "" ルートにリダイレクトします。このリダイレクトを防ぐ必要があります。

「キャンセル」 - リンクを非表示、「2 ページ目」 - 2 ページ目に移動

<script type="text/html" id="template">
    <a href="#" class="cancel">Cancel</a>
    <a href="#second">Second page</a>
</script>

<div id="container"></div>    

<script>
var View = Backbone.View.extend({

    template: $('#template').html(),

    events: {
        "click .cancel": "cancel"
    },

    cancel: function () {
        this.$el.hide();
    },

    render: function () {
        this.$el.html(this.template);
        return this;
    }
});

var AppRouter = Backbone.Router.extend({

    routes: {
        "": "first",
        "second": "second"
    },

ビューを作成し、コンテナーの html を置き換えます

    links: function () {
        var view = new View;
        $('#container').html(view.render().el);
    },

    second: function () {
        this.links();
        $('#container').prepend("<h1>Second page</h1>");
    },

    first: function () {
        this.links();
        $('#container').prepend("<h1>First page</h1>");
    }

});

$(document).ready(function () {
    app = new AppRouter;
    Backbone.history.start();
});
</script>
4

2 に答える 2

3

へのナビゲーションを防ぐために、キャンセル ハンドラから false を返す必要があると思います#。

cancel: function (e) {
        this.$el.hide();
        return false;
    },

http://api.jquery.com/on/言います:

イベント ハンドラから false を返すと、自動的に event.stopPropagation() と event.preventDefault() が呼び出されます。

于 2012-06-26T12:06:14.030 に答える
2

この回答のように、再利用可能な方法でブロッキング ハッシュ ハビゲーションを解決することもできます。

コンテンツが保存されていない場合に別のビューに移動できないようにする

このソリューションは、バックボーン ルーターのコールバックが起動するのを防ぎます。また、ハッシュが変更された後にのみ実行できますが、この関数は以前のハッシュ フラグメントを元に戻すため、気付かれないようにします。

また、この正確な問題については、単に次から変更できます

<a href="#">...</a>

に

<a>...</a>

通常の HTML アンカー タグとして機能しますが (カーソルが に設定されているpointerなど)、どこにも移動しません。

于 2014-07-02T15:47:57.440 に答える