提交后重置HTML表单

14 浏览
0 Comments

提交后重置HTML表单

const scriptURL = 'URL'
const form = document.forms['myform']
form.addEventListener('submit', e => {
  e.preventDefault()
  fetch(scriptURL, {
      method: 'POST',
      body: new FormData(form)
    })
    .then(response => console.log('Success!', response))
    .catch(error => console.error('Error!', error.message))
});


如何在处理表单提交后重置表单?

这是我目前正在做的:

 form.addEventListener('submit', e => {
                          e.preventDefault()
                          fetch(scriptURL, { method: 'POST', body: new FormData(form)})
                          .then(response => console.log('Success!', response))
                          .catch(error => console.error('Error!', error.message))
                          })
                         $('#myform').reset(); // attempt to reset the form

我搜索了类似的讨论,并尝试了 $(\'#myform\').reset();, 明显它不起作用,我是JavaScript新手,如果有人能指点我在哪里学习这些与表单相关的主题,那就太好了。

编辑:表单来源

 

我尝试了以下建议:

  $('#myform').val(''); // not responding
  $('#myform')[0].reset // not responding
  $('#myform').reset(); // not responding
  $('#myform').get(0).reset(); // not responding
  $('#myform').find("input:not([type="submit"), textarea").val(""); // resetting the whole page with performing submission task
  $('#myform')[0].reset() // not responding
  document.forms['myform'].val(""); // not responding
  document.getElementById('#myform').reset() // not responding

admin 更改状态以发布 2023年5月23日
0
0 Comments

您需要获取实际表单,而不是jQuery对象:

$('#myform').get(0).reset();

0
0 Comments

试试这个:

$('#myform').find("input:not([type="submit"), textarea").val("");

它将清除您的表单中的所有数据。但是如果您有预填的值,您应该使用这段代码:document.getElementById('myform').reset()

注意:将'myform'用作您的表单id属性。 例如:

0