尝试使用表单 reset() 函数重置输入字段但不起作用

Question

我正在尝试创建一种 posting 系统，它在大多数情况下都有效，但是当单击 post 按钮时，输入字段不会被重置。我尝试了很多不同的方法，其中 none 行得通，所以这是我最后一次尝试的方法（CodePen 设置了框架代码，所以它不会成为问题）：

HTML:

<form id="post" name="write">
    <div class="textbox">
        <input class="postwriter" name="post" type="text" placeholder="What's on your mind?" id="myPost">
        <button id="Post" onclick= "return write_below(this); return formReset();" value="submit" >Post</button>
    </div>
</form>
<div class="posts" id="postDisplay">
    <p class="para"><span id='display'></span></p>
</div>

JavaScript:

function write_below(form) {
    var input = document.forms.write.post.value;
    document.getElementById('display').innerHTML += "<p>" + Math.floor(Math.random()*20) + ": " + input + "</p>" + "<br/>";
    return false;
}
function formReset(){
    document.getElementById("post").reset();
}

Answer 1

您的 onclick 看起来像这样：

onclick="return write_below(this); return formReset();"

转换为：

return write_below(this);
return formReset();

在第一个 return 之后，脚本结束。所以去掉第一个return。您的代码应如下所示：

onclick="write_below(this); formReset(); return false;"

话虽如此，这里的return false没有意义，所以去掉它。

function write_below(form) {
  var input = document.forms.write.post.value;
  document.getElementById('display').innerHTML += "<p>" + Math.floor(Math.random()*20) + ": " + input + "</p>" + "<br/>";
}

Note: All your IDs look similar, which might make the developers or someone who sees your code mad. Is that your intention?

尝试使用表单 reset() 函数重置输入字段但不起作用

Trying to reset input field with form reset() function but not working

html

javascript

function

reset

codepen