Ajax 形式：新的重置状态答案

【问题标题】：Ajax form: new reset stateAjax 形式：新的重置状态
【发布时间】：2021-03-25 23:38:14
【问题描述】：

我有一个通过 jquery ajax 提交的表单。通过 ajax 提交表单时如何设置新的重置状态？

例如，在页面加载时表单中有一个默认值为“foo”的输入。用户将值更改为“bar”，点击保存（jquery 通过 ajax 将表单数据发送到服务器）。现在，如果用户进行了其他更改并且用户点击了表单重置按钮，我希望它重置为“bar”而不是“foo”。

想要捕获整个表单的“重置”状态，而不仅仅是特定的输入。关于如何实现这一点的任何见解？

【问题讨论】：

jQuery('form').reset()?或者只是有一个<input type="reset"/>？
@putvande 问题似乎不是关于如何重置表单，而是如何更改表单将重置为的默认值/状态。
这会将值重置为原始“foo”值，而不是“bar”。请先看清楚问题。
哦好吧..对不起，误读了这个问题。已经很晚了；）。

标签： javascript jquery html forms

【解决方案1】：

试试这个：

<form>
    <input type="text" name="demoInput" value="foo" />
    <button type="reset">Reset</button>
    <button type="submit">Submit</button>
</form>

<script>
    $('body').on('click', 'button[type=submit]', function () {
      // Store the current value as a data attribute
      $('input').each(function() {
        $(this).data('value',$(this).val());
      });
    });

    $('body').on('click', 'button[type=reset]', function () {
      // Restore the store value
      $('input').each(function() {
        $(this).val($(this).data('value'));
      });
    });

</script>

【讨论】：

【解决方案2】：

我现在不能尝试，但设置输入的 defaultValue 属性可能是一种选择。

【讨论】：

【解决方案3】：

旧问题，但在成功提交后将defaultValue 设置为value 将使重置按钮以新状态工作。

简单的 JQuery 示例：

$("form input").each((ix, t) => { t.defaultValue = t.value; });

【讨论】：