Question

我正在使用backbone.js并且我有一个事件附加到一个按钮，该按钮显示附加到所选元素的表单。提交新表单后，它将替换DOM上的文本。

问题是下一次单击原始按钮不会启动菜单。我不确定发生了什么。

          events: {
        'click .editUser': 'edit',
        // 'click #editPerson': 'editPerson',
        'click .deleteUser': 'remove'
    },

    edit: function () {
        menuBar = $("#editPerson"); ///this is my new input form
        console.log(this.model);
        var model = (this.model);
        console.log(model);

        $(this.el).css("background-color", function (index){
            return "rgba(54,42,64, .9)";
        });
        $(".contact-container").css("margin", function (index){
            return "0 5px 100px 0 ";
        })
        $(this.el).append(menuBar);
        console.log($(this.el));
        menuBar.show();


        $("#editPerson").on('submit', function() {
            console.log("hoook");
            var name = $(".edit1").val();
            var address = $(".edit2").val();
            var telephone = $(".edit3").val();
            var email = $(".edit4").val();

            model.set({name: name});
            model.set({address: address});
            model.set({tel: telephone});
            model.set({email: email});
            // $(":button").removeAttr("disabled");
            return false;
        });

    },

Answer 1

如果它已经在DOM中，为什么要将#editPerson附加到$ el？这样做是从DOM获取节点并将其附加到$ el中。那有难闻的气味！下次您的视图查找此节点时，如果您删除了上一个视图，它将无法找到它，因为它不再位于DOM中。

如果#editPerson只是表单的模板，您可以检索HTML并将其附加到您的视图中：

this.$el.append($("#editPerson").html())

（此。$ el相当于$（this.el）并且'更快'，因为该对象已经存在，当您创建Backbone View时，Backbone会为此分配一个变量。$ el = $（this.el ）为方便起见）

然后，您可以在事件哈希中添加'submit #editPerson'：'onSubmit'键，并将处理程序代码复制到View中的新onSubmit函数。不需要手动进行绑定，因为Backbone会“注意到”（这不是它的工作原理，Backbone没有看到DOM），新的元素已添加到您的视图中，并且事件将起作用。

jQuery - 通过ID启用表单

1 个答案: