JS点击事件传event对象后表单serialize()方法调用报错问题

绑定表单保存按钮点击事件，触发后先做校验，延迟后执行提交逻辑：

// 绑定保存按钮点击事件
$('.saveItem').on( 'click', function(e) {
    submitItemSave(true, e); 
});

function submitItemSave(first_call, currEv) {
  if(first_call){
      $('#multiCribSubmitMsg').show();
      setTimeout(function() { submitItemSave(false, currEv) }, 1);
  } else {
      var currForm;
      // 获取当前按钮所属的表单
      currForm = currEv.currentTarget.closest('form')
      console.log('bottom: ', typeof(currForm)); // 控制台输出 object
      console.log('last: ', currForm) // 控制台打印完整表单DOM结构
      // 执行提交时报错
      $.post('actRequestItemForm.cfm', currForm.serialize(), function() {
          $('#multiCribSubmitMsg').hide();
          loadUpExistingItems();
      });
  }
}

代码执行时抛出错误：

Uncaught TypeError: currForm.serialize is not a function

currEv.currentTarget是原生DOM元素，调用原生DOM标准APIclosest('form')返回的也是原生表单DOM对象，而serialize()是jQuery提供的实例方法，仅挂载在jQuery包装对象上，原生DOM对象本身不存在这个方法，因此调用时会抛出类型错误。
控制台打印typeof currForm得到object、输出完整DOM结构，只能说明该变量是合法的原生DOM节点，不能证明它是可调用jQuery方法的jQuery包装对象。

只需要把获取到的原生表单DOM包装为jQuery对象，即可正常调用serialize()方法，两种改法任选其一即可：

• 方式1：包装原生closest返回的DOM节点

  // 修改获取表单的代码行
  currForm = $(currEv.currentTarget.closest('form'))
  

• 方式2：直接使用jQuery提供的closest方法，获取jQuery包装的表单对象

  // 先将currentTarget包装为jQuery对象，再调用jQuery的closest方法
  currForm = $(currEv.currentTarget).closest('form')
  

内容的提问来源于stack exchange，提问作者AndrewStein