Question

使用html5表单验证时，似乎无法从中清除错误状态。问题出在需要的单选按钮组上。当尝试在没有选择单选按钮的情况下提交它时，它会将所有无线电高亮显示为错误。然后，当我选择1个无线电时，错误消失，但是当执行将清除所选无线电的from.reset（）时，由于没有选择无线电，因此会产生错误。

我发现没有办法绕过这个。我尝试过使用setCustomValidity（''）但是没有用。暂时禁用验证并重新启用验证也无效。

唯一的方法是从dom中完全移除并重新生成它。仅删除单选按钮并重新生成它们将不起作用（至少具有相同的ID）。

有什么想法吗？

见小提琴：http://jsfiddle.net/KDkvE/
不要选择一个选项，然后按“下一步”。然后按重置。在Firefox中，这不会清除单选按钮周围的红色边框。

<form>
<option name='test' type='radio' value='1' required/>
<option name='test' type='radio' value='2' required/>

<input type="submit" name="submitbutton" id="submitbutton" value="next">
<input type='reset' value='Reset'/>
</form>

Answer 1

我自己正在寻找一个优雅的解决方案，但是到目前为止还没有人聪明地回答它，我将不得不提供这种不优雅的解决方案：

<input type="radio" name="radio_button_name" onclick="for(i=0;i&lt;this.form[ this.name ].length;i++){ this.form[ this.name ][i].setCustomValidity('') }" oninvalid="custom validation message">

问题似乎是您需要为每个单选按钮重置验证自定义消息，而不仅仅是您单击的按钮。

清除html5表单错误

1 个答案: