访问表单提交上的对象属性（vanilla javascript）

Question

我决定回去重新学习香草js，因为我一直都依赖于jquery。

我想制作一些简单的食品订单。

我的问题是，在我的提交方法中，“this”将引用正在提交的表单，而不是我的placeOrder对象。

提交订单时，我想将其推送到cacheDom内的orders数组。显然，它不能在表单对象上使用push方法。

有人可以提供有关如何解决这个问题的建议吗？

(function () {

var placeOrder = {
  init: function() {
    this.cacheDom();
    this.bindEvents();
  },
  cacheDom : function() {
    this.orderForm = document.getElementById('place-order-form');
    this.elements = this.orderForm.elements;
    this.orders = [];
  },
  bindEvents: function() {

    if(this.orderForm.addEventListener){
      this.orderForm.addEventListener("submit", this.submitOrder, false);  
    } else if (this.orderForm.attachEvent){
      this.orderForm.attachEvent('onsubmit', this.submitOrder);          
    }
  },

  submitOrder: function(e) {
    // this refers to the form being submitted
    e.preventDefault();
    var elements = this.elements;
    var order = {};

    for (var i = 0; i < elements.length; i++) {
      if (elements[i].tagName !== 'BUTTON') {
        if (elements[i].name === 'name') {
          order.name = elements[i].value;
        } else if (elements[i].name === 'food') {
          order.food = elements[i].value;
        }
      }
    }

    //this.orders.push(order);
    console.log(this);

  }

};

placeOrder.init();


}());