是否有“提交后”的 jQuery 选项？

Posted 2023-02-22

【中文标题】是否有“提交后”的 jQuery 选项？

【英文标题】：Is there an "after submit" jQuery option?

【发布时间】：2011-07-07 08:51:50

【问题描述】：

我有一个表单，可以上传文件并定位页面上的 iframe。当用户点击提交时，我希望将文件内容“清除”出来。

我试过了

$('#imageaddform').submit(function()
    $('#imagefile').val('');
);

但它会在提交之前清除表单，因此不会上传任何内容。

提交后如何清除？

【问题讨论】：

不作为答案，因为这是一个猜测：$('iframe').load(function() $('#imagefile').val(''); );

我没有使用 jquery 表单回发。但是在我点击按钮之后，在阅读之后，但在下一页加载之前，你是正确的。它以 iframe 为目标，浏览器窗口永远不会重新加载。

【参考方案1】：

如果您没有绑定其他处理程序，则可以执行以下操作：

$('#imageaddform').submit(function(e) 
    e.preventDefault(); // don't submit multiple times
    this.submit(); // use the native submit method of the form element
    $('#imagefile').val(''); // blank the input
);

【讨论】：

提交表单不替换页面吗？

如果还有其他绑定的处理程序呢？

这不会创建一个无限的提交循环，会循环调用这个回调吗？

@Čamo 不，因为调用原生表单元素的 submit 函数不会调用 jQuery 处理程序。

【参考方案2】：

Lonesomeday 的解决方案对我有用，但对于 Google Chrome，我发现它仍会提交空表单数据，除非我添加了这样的超时：

$('#imageaddform').submit(function(e) 
    e.preventDefault(); // don't submit multiple times
    this.submit(); // use the native submit method of the form element

    setTimeout(function() // Delay for Chrome
        $('#imagefile').val(''); // blank the input
    , 100);
);

【讨论】：

Gondrup ...非常感谢您为 Chrome 发布该解决方案...在找到您的解决方案之前，我以为我正在失去理智。 Chrome 在提交之前会清除表单。

刚刚经过测试，Chrome 似乎不再需要此 hack。对于推送更新，我不确定向后兼容性对 Chrome 有多么重要。

我认为这取决于预期的可靠性。最好使用此 hack，而不是破坏某些用户的重要功能

仍然需要超时。现在（Chrome 61）我尝试在表单提交后执行location.reload()（它提交给target="_blank"），但它没有超时就无法工作。

【参考方案3】：

你可以这样做：

$('#imageaddform').submit(function()
  setTimeout(function() 
    $('#imagefile').val('');
  ,100);
);

【讨论】：

一台速度慢的计算机需要更多的时间来发送带有您的代码的请求，这取决于现代 PC 的使用，这不是标准或有用的。有时有效，有时无效。

@WHK，实际上，即使是最慢的计算机也能正确执行此操作，并且始终可以正常工作，因为它需要的只是一个损坏的调用堆栈，仅此而已。

这就像放一块砖来阻止房子的门看起来使用正确的钥匙，两种方式都可以，但是砖不是用来锁门的，为什么使用：e.preventDefault( )。

【参考方案4】：

你是如何提交表格的？如果这是正常的表单帖子，那么在这种情况下页面将不存在我想知道您是否希望在页面刷新之前清除表单，以便当用户回来时他看不到填充的值。

如果表单是通过ajax提交的，那么可以

function()
 $('form1')[0].submit();
 clearForm();

我错过了这个问题吗？

【讨论】：

页面不刷新。它以 iframe 为目标

没想到会出现这种情况。您可以使用上面发布的计时器方法。或者我可以告诉一个解决方法。使用隐藏变量并将您的详细信息放在那里并提交该字段。同时清除主窗体。因此，这将使表单看起来已清除。只是一个解决方法，但肮脏的解决方案

David 在问题的 cmets 中发布了解决方案。到目前为止，这是最适合我的解决方案。

@David 这是个好主意，可以完成工作。但我喜欢setTimeout, and e.preventDefault() 的其他两个答案都与提交后的问题相关，而不是在 iframe 加载后。希望这些也能奏效。我没有投票，因为我没有测试那些