使用主干网中的输入捕获表单提交事件

Capturing form submit events using enter in backbone

本文关键字：表单提交 事件 输入 主干网      更新时间：2023-09-26

我的backbone.js表单只有一个文本字段（没有提交按钮）。我需要在视图中捕获提交事件（使用回车键）。下面是示例代码。不知怎的，在按下回车键时不会调用submit方法。相反，表单会重新加载。

脚本：

var FormView = Backbone.View.extend({
    el: '#form',
    events: {
        "submit": "submit",
    },
    initialize: function () {
        console.log("initialize");
    },
    submit: function (e) {
        e.preventDefault();
        console.log("submit");
    }
});
new FormView();

HTML:

<form id="form">
  <input type="text"/>        
</form>

将其添加到您的主干视图：

events: {
  'submit form': 'submit'
}

另外，请注意，在HTML中，必须定义表单操作。

如果你没有定义动作，那么就这样做：

events: {
  'keyup': 'processKey'
}
processKey: function(e) { 
  if(e.which === 13) // enter key
    this.submit();
}

如果在捕获提交事件时遇到问题，请确保在视图中定义了'el'属性。

var myView = Backbone.View.extend({
    el: $(body), 
    events: {
       "submit form": "doMethod" 
    }, 
    doMethod: function(e) {
        e.preventDefault();  
        console.log('form fired');
    }  
});
相关文章：