我该怎么做才能在有人按下提交时清除表单？

Question

我有一个由 HTML 和 CSS 制作的网站。我在里面有一个联系表。我并没有真正使用这个表单，所以我不需要它来实际向我发送输入的数据，但我确实需要它来在有人按下提交时清除表单。我使用的代码是：

<div class="form">
                <div class="form-group">
                    <input type="text" id="fullName" placeholder="Your name">
                    <label for="fullName">Your name</label>
                </div>

                <div class="form-group">
                    <input type="email" id="email" placeholder="Your email">
                    <label for="email">Your email</label>
                </div>

                <div class="form-group">
                    <textarea name="message" id="message" placeholder="Message"></textarea>
                    <label for="message">Message</label>
                </div>

                <div class="spacer10"></div>

                <div class="center-btn-wrapper">
                    <button type="submit" class="btn">Send</button>
                </div>
            </div>

Answer 1

首先，在表单标签中添加所有内容，然后在脚本标签或您的 javascript 文件中使用 reset() 方法，如下所示：

document.getElementById("myForm").reset();

Answer 2

如果您正在使用任何框架，请注意，我认为这应该有助于在使用 js 提交后将字段设置为空字符串。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <div class="form" id="myForm">
                <div class="form-group">
                    <input type="text" id="fullName" placeholder="Your name">
                    <label for="fullName">Your name</label>
                </div>

                <div class="form-group">
                    <input type="email" id="email" placeholder="Your email">
                    <label for="email">Your email</label>
                </div>

                <div class="form-group">
                    <textarea name="message" id="message" placeholder="Message"></textarea>
                    <label for="message">Message</label>
                </div>

                <div class="spacer10"></div>

                <div class="center-btn-wrapper">
                    <button type="submit" class="btn" onclick="clearForm()">Send</button>
                </div>
         </div>
</body>
</html>
<script>
function clearForm(){
  document.getElementById('fullName').value = '';
  document.getElementById('email').value = '';
  document.getElementById('message').value = '';
}
</script>

我该怎么做才能在有人按下提交时清除表单？

How do I make it so that when someone presses submit, the form clears?

html

css

forms

submit

button