HTML5 中约束验证的只读元素候选者答案

【问题标题】：Readonly elements candidate for constraint validation in HTML5HTML5 中约束验证的只读元素候选者
【发布时间】：2015-05-24 01:49:26
【问题描述】：

HTML5 specification 声明：

可提交元素是约束验证的候选对象，除非条件禁止元素进行约束验证。（例如，如果一个元素是 object 元素，则该元素将被禁止进行约束验证。）

验证步骤包括：

对于controls 中的每个元素field，按树形顺序运行以下子步骤：

如果field 不是约束验证的候选对象，则继续下一个元素。

否则，如果 field 满足其约束条件，则转到下一个元素。

否则，将field 添加到invalid controls。

我想知道为什么这段代码没有按预期工作：

'use strict';

alert(document.getElementById('foo').willValidate); // expected: true; true
alert(document.getElementById('bar').willValidate); // expected: true; false
alert(document.getElementById('baz').willValidate); // expected: false; false

alert(document.getElementById('foo').checkValidity()); // expected: false; false
alert(document.getElementById('bar').checkValidity()); // expected: false; true

<input type=text required id=foo>
<input type=text required id=bar readonly>
<input type=text required id=baz disabled>

这是用户代理实现中的错误还是预期？

【问题讨论】：

标签： javascript html validation forms

【解决方案1】：

看看这里：http://www.w3c-test.org/html/semantics/forms/constraints/form-validation-willValidate.html

input 或 type='text' 的条件之一是：

如果它是只读的，则必须禁止它进行约束验证

仅供参考：假设readonly 元素已经包含一个值，通常不需要required 属性。

【讨论】：