我在Chrome中遇到问题，表单提交会导致以下错误：
An invalid form control with name='ctl00$cphMain$ctl01$groupControl$website' is not focusable.
这是<input type="url" ...>在<div>内设置display:none的Chrome中呈现的required（直到选中相邻的复选框）。没有maxlength属性，也没有设置<fieldset>属性，因此我不确定提交失败的原因。以下是标记的相关部分（有问题的控件位于第二个<label class="checkbox">
<input id="ctl00_cphMain_ctl01_groupControl_ctl13" type="checkbox" name="ctl00$cphMain$ctl01$groupControl$ctl13" onclick="$(this).parent().siblings('div.expandableContainer').slideToggle();"/>
Include contact...
</label>
<div class="expandableContainer form-expanded js-initial-hide " style="display: none;">
<fieldset>
<label>
Name:
<span class="req">*</span>
</label>
<input name="ctl00$cphMain$ctl01$groupControl$name" type="text" maxlength="100" id="ctl00_cphMain_ctl01_groupControl_name"/>
</fieldset>
<fieldset>
<label>
Website:
<span class="req">*</span>
</label>
<input name="ctl00$cphMain$ctl01$groupControl$website" type="url" id="ctl00_cphMain_ctl01_groupControl_website" value="http://" onblur="if (this.value == 'http://') this.style.color = '#666';" onfocus="this.style.color = '#000';" style="color:#666;"/>
</fieldset>
<fieldset>
<label>
Email:
<span class="req">*</span>
</label>
<input name="ctl00$cphMain$ctl01$groupControl$email" type="email" maxlength="100" id="ctl00_cphMain_ctl01_groupControl_email"/>
</fieldset>
</div>
内）：
<div>根据W3.org（http://www.w3.org/TR/html401/interact/forms.html#successful-controls），这可能是一个“成功”控制。即使添加2000的MaxLength（DB字段宽度）也不起作用。没有收到周围控件的错误。
有没有想过为什么这个表单提交失败？选中此框（以显示周围的display:block（使用{{1}}），可以毫无问题地提交表单。
非常感谢。
答案 0 :(得分：3)
我发现了问题：不可见的URL字段（<input type="url" ... />）有一个非空的值集（基本上是实现占位符文本的遗留JavaScript解决方案的一部分）。出于某种原因，这个隐形字段中的值会绊倒Chrome（可能来自他们的内置验证，其他人讨论类似的问题已经提到过）。也许Chrome错过了祖先<div>中指定的缺乏可见性。
我如何解决这个问题：
onblur，onfocus和style属性，因为它们是多余的; value属性更改为新的HTML5 placeholder属性，并保留相同的属性值。唯一的缺点是网站访问者必须在字段中手动输入“http://”而不是附加到其中;我们的项目团队将讨论改善此用户体验的策略。