JavaScript：点击提交给自己后清除表单数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22890344/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript: Clear form data after submit to self on click
提问by Chezshire
Student newb here working to construct a history of my class assignments in a manner which is helpful to me for future reflection; Currently I'm doing a form assignment, which works but i'm trying to push it a touch to get the most out of the experience. My goal is that if i click the 'reset' button the form will clear regardless of if i've clicked the submit ('continue') button or not. Currently if i click the clear button before clicking the submit button, the form data will clear. But if i've clicked the continue (to submit the form to self and the form data is now sitting on in the url), the data will not clear.
新来的学生正在努力以有助于我未来反思的方式构建我的课堂作业的历史；目前我正在做一个表格分配，它有效，但我试图推动它以获得最大的体验。我的目标是，如果我单击“重置”按钮，无论我是否单击“提交”（“继续”）按钮，表单都会清除。目前，如果我在单击提交按钮之前单击清除按钮，表单数据将被清除。但是，如果我单击了继续（将表单提交给 self 并且表单数据现在位于 url 中），则数据将不会清除。
this is my javascript function
这是我的 javascript 函数
<script>
/* JS to clear form */
function myFunction() { document.getElementById("myForm").reset(); }
</script>
this is the whole form part of the code:
这是代码的整个表单部分：
<form enctype="multipart/form-data" action="./itc216.php" method="get">
Name: <input ="text" name="userName" value="<?php echo $userName; ?>" />
<span class="error"><?php echo $errorMessage1; ?></span><br /><br />
Amount: <input ="text" name="mealTotal" value="<?php echo $mealTotal; ?>" />
<span class="error"><?php echo $errorMessage2; ?></span><br /><br />
<input type="checkbox" name="agreement" <?php echo $agreement; ?> />
Do you agreement to the terms and conditions?
<span class="error"><?php echo $agreementError; ?></span><br /><br />
<input type="submit" name="submit" value="Continue" /> | <input type="reset" onclick="myFunction()" value="Reset!">
</form>
回答by TwHello Inc
Reset does not clear the form, but resets the form to its default values. If you are pre-populating the form inputs with the submitted data, those are what the form will reset to. If that's the case, to clear the form, you will need to have Javascript set all values to empty.
重置不会清除表单，而是将表单重置为其默认值。如果您使用提交的数据预先填充表单输入，这些就是表单将重置的内容。如果是这种情况，要清除表单，您需要让 Javascript 将所有值设置为空。
回答by Dov D.
It sounds like you want to redirect after processing the form, so that the URL is clear.
听起来你想在处理完表单后重定向，这样 URL 就清楚了。
This is generally a good idea even when doing a POST, so that refreshing the page doesn't create a new entry.
即使在执行 POST 时，这通常也是一个好主意，因此刷新页面不会创建新条目。
I guess you aren't really processing the form yet so you don't have a way to display the entry unless it's in the URL, but that would be the correct way to do it.
我猜您还没有真正处理表单，因此您无法显示条目，除非它位于 URL 中，但这将是正确的方法。
回答by Clayton
You may need to use event delegation
您可能需要使用事件委托
$('#clearbutton').on('click', function(){
$("#myForm").reset();
});
回答by Aswin Raghavan
You Forgot to add the id for the form in the form add
您忘记在表单添加中添加表单的 id
<form enctype="multipart/form-data" action="./itc216.php" method="get" id="myForm">
