提交表单后，重置按钮无法以表格工作

Question

我有一个php page'search.php'。页面中的一种形式。我有一个提交和一个重置按钮。重置按钮在提交表格之前起作用，但提交后不起作用。表单提交后，将页面重定向到同一页面（search.php）以查看包含相同表单的结果。有人对这个问题有线索吗？

    <form action="http://localhost:8888/search/validate_search" name="search" id="search" method="post" accept-charset="utf-8">
    <p>
        <label for="name">Name</label>
        <input type="text" name="name" id="name" value="" required="required">
    </p>
    <p>
        <label for="country">Country</label>
        <select name="country[]" id="country">
            <option value="">Select</option>
            <option value="Afghanistan" >Afghanistan</option><option 
value="Albania" >Albania</option><option value="Algeria" >Algeria</option><option value="American Samoa" >American Samoa</option><option value="Andorra" >Andorra</option><option value="Angola" >Angola</option><option value="Anguilla" >Anguilla</option>            </select>
    </p>
    <p id="nofloat">
        <input type="submit" name="searchButton" value="Search" id="searchButton"  />
        <input type="reset" name="reset" value="Reset" id="reset123"/>
    </p>
   </form>  

Answer 1

type='reset'的行为不是要清除表单元素，而是要在加载页面时将它们返回到初始/默认值。提交表单后，如果然后将提交的值传递给表单的预填充（设置为初始值）的表单，则您的重置按钮只会将字段重置为那些传递的值，而不是一个"干净"状态。要实际清除表单，您需要使用JavaScript。

这是一个示例，适用于您的问题中给出的HTML ...

<script>
function customReset()
{
    document.getElementById("name").value = "";
    document.getElementById("country").value = "";
}
</script>

只需将重置按钮更改为

<input type="button" name="reset" value="Reset" id="reset123" onclick="customReset();"/>

实时示例