单击按钮即可创建按钮

Question

我有一个按钮，按下按钮时我需要创建更多按钮。

这是我为按钮编写的内容：

<div class="response-container" id="response-container">
    <a href="#" class="button add-button" id="add-button">Add button</a>
</div>

我正在尝试学习 Backbone.js，所以我编写了一个视图来在单击添加按钮时创建更多按钮。

createButton = Backbone.View.extend({
    events: {
        'click .add-button': 'add_script'
    },
    add_script: function() {
        console.log('Pressed');
        //create a new button from here? 
     }
});

有人可以帮我做吗？

console.log('Pressed')

甚至不起作用。我正在尝试学习 Web 开发，请问您有什么可以建议我的文档吗？欢迎在 Backbone.js 中提出所有建议

Answer 1

您必须创建视图的对象。 像这样

var createButton = Backbone.View.extend({
  el: '#response-container',
    events: {
        'click .add-button': 'add_script'
    },

    initialize: function() {
        console.log("initialized");
    },
    add_script: function() {
        console.log('Pressed');
        //create a new button from here? 

    this.$el.append('<input type="button" value="new button"/>');


     }
});

var cb = new createButton();

这是DEMO

Answer 2

您如何尝试实现这一目标不是最佳实践（因为这应该通过模板完成），但您可以这样做： 首先，您必须在您的案例中定义 el 元素示例 el: '#response-container'

events: {
        'click #add-button': 'add_script'
    },
    add_script: function() {
        console.log('Pressed');
        //if you have el 
        this.$el.append('<input type="button" value="new button"/>');
        //or as jquyer add element  
         var r= $('<input type="button" value="new button"/>');
            $("body").append(r);
     }

Answer 3

我认为最后一个答案是最佳答案

var createButton = Backbone.View.extend({

el: '#response-container', 事件：{ '点击.add-button': 'add_script' },

initialize: function() {
    console.log("initialized");
},
add_script: function() {
    console.log('Pressed');
    //create a new button from here? 

this.$el.append('<input type="button" value="new button"/>');


 }

});