javascript - 失去焦点时提交表单

Question

我有一个动态创建的表单，上面附加了一个提交事件侦听器，所以我可以做一些 ajax 请求来保存数据。

但是我也想在失去焦点时提交它。

我进行了调用form.submit()，但之前创建的事件侦听器被忽略了。

form.addEventListener('submit', function (event_handler) {
    event_handler.preventDefault();
    /* some code */
});

// if loses focus
form.addEventListener('blur', function (event) {
   form.submit(); // submits, but ignores the defined eventListener so the preventDefault() is ignored.
   return false;
}, true);

我期待 form.submit() 将运行提交侦听器中定义的代码。

任何方式来解决这个问题。

没有 jQuery 或任何其他框架。只是香草js。

Answer 1

确实有问题。当您调用 JavaScript form.submit() 时，它有时会覆盖事件侦听器。简单的解决方案就是调用一个提交函数并调用它。

 function runBeforeSubmit()
 {
     /* some code */
 }


 form.addEventListener('submit', function (event_handler) {
    event_handler.preventDefault();
    runBeforeSubmit(); <------------------------ shared code to process before submit
 });

 // if loses focus
 form.addEventListener('blur', function (event) {
   runBeforeSubmit(); <------------------------ shared code to process before submit
   form.submit();
   return false;
}, true);