Question

作为主题，我已经阅读了有关类似问题的另一个问题： modal-dialog-with-backbone-and-marionette

但我不想在项目中引入backbone.marionette。

我想知道是否还有其他选择？

Answer 1

我通过将div作为模态对话框的容器放入页面底部来解决它：

    <!-- Charge -->
    <div id="charge_dialog_container" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

    </div>

在模板中定义了对话框的其余部分：

    <script id="charge_dialog_template" type="text/template">
        <div class="modal-header">
            ...
        </div>
        <div class="modal-body">
            ...
        </div>
        <div class="modal-footer">
          <button class="btn btn-primary" data-dismiss="modal"><i class="icon-ok"></i> OK</button>
        </div>
    </script>

在initialize函数中的视图构造期间，我执行了modal()内容：

        ChargeView = Backbone.View.extend({
            el: $('#charge_dialog_container'),
            initialize: function() {
                this.render();
                this.$el.modal({'backdrop': 'static'});
            },
            render: function() {
                var template = _.template($('#charge_dialog_template').html());
                this.$el.html(template);
            }
        });

如何让twitter bootstrap.modals与骨干一起玩得很好？

1 个答案: