重置按钮不会清除HTML5中的字段

Question

我有一个页面，该页面从文件读取并显示过滤的结果，具体取决于在搜索框中输入的内容。 当我单击“重置”按钮时，它清除了我想要的搜索框，但我也希望清除过滤​​的结果。 如果我取消注释下面的通话，此通话目前已被注释-可以，但是搜索框无法清除。

HTML：

<form>
    <ul data-bind="foreach:properties">
        <li><input data-bind="attr:{placeholder:id},event:{change:$root.onInputChange}, value:value, valueUpdate: 'afterkeydown'" /></li>
    </ul>   
    <input type="reset" value="Reset"/>
    <!--<input type="reset" value="Reset" data-bind="click:$root.onclick"/>-->
</form>
<p></p>
<table data-bind="foreach:itemsFiltered">
    <tr data-bind="foreach:$parent.formatItem($data)">
        <td data-bind="text:value"></td>
    </tr>
</table>

我需要搜索框和过滤后的结果才能清除。

Answer 1

重置表单会将表单中的字段重置为其默认值（由value属性指定）。 除非默认值为空白，否则不会清除字段。

您的JavaScript正在设置value属性。

如果要清空字段，则需要将其value 属性设置为空字符串，而不是简单地重置表单。