主页 / 问题 / 1346520
Accepted
Ev Tr
Asked:2022-04-06 22:10:50 +0000 UTC2022-04-06 22:10:50 +0000 UTC

在先前提交的处理程序正在运行时重新提交表单

  • 772

有来自用户的重复消息。推测的原因是表单处理程序工作了很长时间，在此期间用户多次拉动提交按钮。我自己无法重现这种情况 - 我点击重新发送按钮不，但可能有浏览器可以使用。很明显，您需要治疗“疾病的原因”，而不是症状 - 处理那些挂在表单回调上并导致抑制的事件，但现在您需要放置一个临时补丁。我试图使按钮在按钮单击或表单提交事件时处于非活动状态。但是 disabled 属性不会添加到标记中。可能是因为提交表单后页面被重新加载并且此时的标记不能被Javascript更改？（或没有？）是否可以在页面重新加载期间更改客户端标记中的某些内容？客户端可以在重新加载期间再次拉按钮吗？这可能在哪些浏览器上？按钮代码：

<input type="submit" accesskey="s" tabindex="6" name="post" value="Отправить" class="button1 default-submit-action">

表格标题：

<form id="postform" method="post" action="./posting.php?mode=post&amp;f=33" enctype="multipart/form-data">

我尝试过但不起作用的方法：

$('input[name="post"]').on('click', function() {                        
                        $('input[name="post"]').prop('disabled', true);
                    });

更多的：

$(this).find('input[type="submit"]').attr('disabled','disabled');

$('input[type=submit]').one('submit', function() {
     $(this).attr('disabled','disabled');
 });
javascript

1 个回答

  1. Best Answer

    当然，当页面更新时，一切都会重新加载。重现这种情况（当用户发送多条消息时） - 发送消息后，刷新页面，确认重新提交，您将看到另一条消息。出于某种原因（也许他们正在等待对消息的响应），您的用户有时会刷新页面并且您会收到几条相同的消息。

    如何处理？好吧，通过JS提交表单，无需刷新页面。加减所以

    <form id="postform">
 ... поля формы
 <button type="submit" id="submitForm">Отправить форму</button>
</form>

<script>
document.getElementById("postform").addEventListener('submit', funcSubmit);
const buttonSubmitForm = document.getElementById("submitForm");

const funcSubmit = async () => {
  buttonSubmitForm.prop('disabled', true);

  const response = await fetch('url', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json;charset=utf-8'
    },
    body: JSON.stringify({
      // Поля формы
    })
  });

  buttonSubmitForm.prop('disabled', false);

  // Тут обрабатываете полученные данные из формы
  // добавляете сообщение в DOM-дерево, обрабатываете ошибки и прочее
}

</script>

    很明显，您需要一个单独的 url 来接受表单字段并在响应中发出带有此工作结果的 JSON。

    • 0

相关问题