如何从Backbone.js中的View对象中获取当前模板中的所有元素

Question

如何从backbone.js中的View对象中的当前模板获取所有输入元素，以便我可以检查input元素中的值。

/*template*/

<script id="emptemplate" type="text/template">
<input id="name" value="{name}"/>
<input id="address" value="{address}"/>
<input id="sex" value="{sed}"/>
<footer>
   <button id="save">save</button>
</footer>
</script>

/*javascript*/

var EmployeeView = Backbone.View.extend({
  ...
  render:function(){
  ....
  },
  events:{
    "click #save": "saveData"
  },
  saveData: function (e) {
        var Data = [];
        $('input').each(function (value, key) {
            /*my problem here:
             cannot able to get the value of input element!
             */
            var v = value;
            var k = key;
        });
    }
  });

Answer 1

将渲染功能更新为

render: function(){
       var template = _.template( $("#emptemplate").html(), {} );
       this.$el.html( template );
}

然后尝试...它会将模板添加到您的视图中，然后您可以绑定并对其执行操作

Answer 2

我想出了解决方案，迭代到当前视图中的所有输入元素以从中获取值。 在“saveData”事件处理程序中，当用户单击“保存”按钮时，如下所示：

saveData:function(){
var data=[];
this.$el.find('input').each(function(){
$input=$(this);
//build the array of [key, value]
data[$input.attr('id')] = $input.val();
}
});