如何将一个视图移动到另一个视图?

how to move one view to another view?

能否请您告诉我如何在 backbone 中从一页导航到另一页。 我想在按钮点击时显示第二个 html 如何实现

我太喜欢了。我反对这样的活动

events: {
         'click #click':'moveTonext'
        },

       moveTonext: function(){
          alert('---')
        },

我这样制作第二页

define([
    'jquery',
    'underscore',
    'backbone',
    'text!templates/second.html'
], function ($, _, Backbone, statsTemplate) {
    'use strict';

    var secondView = Backbone.View.extend({

        // Instead of generating a new element, bind to the existing skeleton of
        // the App already present in the HTML.
        el: '#todoapp',

        // Compile our stats template
        template: _.template(statsTemplate),

        // Delegated events for creating new items, and clearing completed ones.
        events: {

        },



        // At initialization we bind to the relevant events on the `Todos`
        // collection, when items are added or changed. Kick things off by
        // loading any preexisting todos that might be saved in *localStorage*.
        initialize: function () {
          this.render();
        },

        serialize: function () {
          return {
            message: 'world'
          };
        },

        // Re-rendering the App just means refreshing the statistics -- the rest
        // of the app doesn't change.
        render: function () {
          this.$el.html(this.template());
        }
        // Add a single todo item to the list by creating a view for it, and
        // appending its element to the `<ul>`.



    });

    return secondView;

})

第二个html

<h1>second</h1>

这是我的笨蛋 http://plnkr.co/edit/fCXwSrroJP1l6BppjpmD?p=preview

基本上您的按钮应该触发导航,所以 click 处理程序应该如下所示:

moveToNext: function () {
    router.navigate("other/path", { trigger: true });
}

然后,在您的 router 代码中,您需要为上述路径添加路由处理程序:

routes: {
    "other/path": "handleOtherPath"
},

handleOtherPath: function () {
    new SecondView();
}

这是针对 SecondView 应该替换 FirstView 的情况。如果应该附加它,可以使用以下机制:

moveToNext: function () {
    new SecondView({ el: this.$(secondViewContainerSelector) });
}

这是一个有效的 Plunker sample