Question

我有一个带有两个提交按钮的表单。我正在使用＆＃39;名称＆＃39;属性以查看正在单击哪一个以提交表单。我想在使用jquery提交以下函数时禁用按钮：

$(document).on('submit', '.js-form', function(e) {
   $(this).find('input[type=submit]').prop('disabled', true);
});

问题是这样做之后我发现名字属性不再被发送了。我已经检查了已发送的请求（在网络标签中 - chrome），即使在以前发送请求之前也没有发送任何问题。

任何人都可以告诉我为什么会这样，以及我如何克服它？

感谢

Answer 1

您应该通过捕获表单来禁止提交表单。您可以通过向表单添加一个类来完成此操作，如果它具有该类，则停止该事件。

 $(document).on('submit', '.js-form', function(e) {
     if ($(this).hasClass('disabled')) {
         // Form is disabled, stop the event
         e.preventDefault();
         e.stopPropagation();
         return false;
     } else {
         // Allow first submit and add class to stop subsequent
         $(this).addClass('disabled');
     }
 });

然后，这不会清除或禁用任何按钮，允许所有数据通过。

Answer 2

提交表单后，请勿禁用提交按钮。浏览器已经在技术上为您处理此问题。提交表单后，浏览器将不接受任何其他成功的表单提交。当然，用户可以在页面加载前单击不同的按钮，但不会多次提交表单（除非您使用ajax或其他解决方案）。

禁用表单提交会阻止发送按钮属性

2 个答案: