本文介绍了提交后重置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 name="myform">
<div class="col-md-6 col-sm-6">
<div class="form-group">
<label for="email" class="sr-only">Email</label>
<input name="email" class="form-control" type="email" placeholder="Email" required>
</div>
</div>
<div class="col-md-6 col-sm-6">
<button type="submit" class="btn btn-default btn-block">Subscribe</button>
</div>
</form>
在处理表单提交后如何重设表单?
How can I reset my form after handling form submission?
这是我目前正在做的事情:
Here's what I am doing currently:
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还是陌生的,那就太好了
I searched for similar threads and tried $('#myform').reset();
Clearly it's not working,I am new to Javascript if anyone can point me where to learn this form related topics then it will be great
表单源
<form name="myform" id="myform">
<div class="col-md-6 col-sm-6">
<div class="form-group">
<label for="email" class="sr-only">Email</label>
<input name="email" class="form-control" type="email" placeholder="Email" required>
</div>
</div>
<div class="col-md-6 col-sm-6">
<button type="submit" class="btn btn-default btn-block">Subscribe</button>
</div>
</form>
我尝试了以下建议:
$('#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
推荐答案
尝试一下:
$('#myform').find("input:not([type="submit"), textarea").val("");
它将清除您表格中的所有数据.但是如果您具有预填充值,则应使用以下代码:document.getElementById('myform').reset()
It will clear all data of your form. but if you have prefilled value, you should use this code: document.getElementById('myform').reset()
这篇关于提交后重置HTML表单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!