javascript - 清除html5表单错误

标签 javascript html forms validation

当使用 html5 表单验证时,似乎不可能从中清除错误状态。 问题出在所需的单选按钮组上。当尝试在未选择单选按钮的情况下提交它时,它会将所有单选按钮突出显示为错误。 然后,当我选择 1 个 radio 时,错误消失,但是当执行 from.reset() 清除所选 radio 时,由于没有选择 radio ,因此会生成错误。

我没有找到解决这个问题的方法。我尝试过使用 setCustomValidity('') 但没有成功。 另外,暂时禁用验证并重新启用它也不起作用。

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

有什么想法吗?

参见 fiddle :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>

最佳答案

我自己正在寻找一种优雅的解决方案,但由于到目前为止还没有一个聪明的人回答这个问题,我将不得不提供这个不优雅的解决方案:

<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">

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

关于javascript - 清除html5表单错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15251961/

相关文章:

html - 如何制作一个完整的 HTML 表单 "readonly"?

php - 尝试显示数组的 mysql 查询结果

javascript - 需要帮助格式化字符串文字正则表达式

javascript - 当 h :selectOneMenu is selected 的特定项时调用特定的 JavaScript 函数

javascript - 哪个是企业级 JS 编程的更好框架 - jQuery 或 Prototype,为什么?

javascript - 如何在加载时根据条件隐藏 Ext 菜单中的项目

html - Rails - 使用 h() 转义 HTML 并排除特定标签

javascript - AngularJS + RoR : call controller's function from HTML

html - 输入的样式看起来像超链接

javascript - 如何使用 JavaScript 在页面上提交第一个表单?