javascript - 修复输入字段后，html5 oninvalid 不起作用

Question

我的表单中有这个输入代码:

<input maxlength="255" id="information_name" name="information[name]" oninvalid="check(this)" placeholder="Nombre Completo" required="required" size="30" style="width:528px;height:25px;" tabindex="3" type="text">

我用这段 javascritp 代码更改了 oninvalid 消息:

<script>
 function check(input) {
   if (input.value == "") {
     input.setCustomValidity('Debe completar este campo.');
   } else  {
     input.setCustomValidity('Debe corregir este campo.');
   }

 }
</script>

问题来了，如果我点击提交，字段为空，字段显示错误，所以我需要填写字段，但填写字段后，即使填写不为空，我仍然收到警告。

我做错了什么？？？

Answer 1

如果您使用 setCustomValidity() 设置值，则该字段无效。即设置非零长度字符串会导致浏览器认为该字段无效。为了使您的新输入生效，您必须清除自定义有效性。您可以简单地使用以下内容:

<input required maxlength="255" id="information_name" minlength=1 name="information[name]" oninvalid="setCustomValidity('Should not be left empty.')" 
   oninput="setCustomValidity('')" />

不需要为此使用 Javascript。