修复输入字段后，html5 oninvalid不起作用 [英] html5 oninvalid doesn't work after fixed the input field

问题描述

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

 < input maxlength =255id =information_namename =information [name]oninvalid =check（this）placeholder =Nombre Completorequired =requiredsize =30style =width：528px; height：25px; tabindex =3type =text> 
  

我用这个javascritp代码更改oninvalid消息：

 < script> 
函数检查（输入）{
 if（input.value ==）{
 input.setCustomValidity（'Debe completour este campo。'）; 
} else {
 input.setCustomValidity（'Debe corregir este campo。'）; 
} 
 
} 
< / script> 
  

这是问题所在，如果我点击提交并且该字段为空，则字段会出现错误所以我需要填写该字段，但填写完字段后，即使填充不为空，我仍然收到警告。

我在做什么错？ 可以使用 setCustomValidity 设置自定义有效性消息，非空白字符串将导致该字段的行为就好像它具有无效值一样。您需要 setCustomValidity（''）来清除该字段的无效状态。

如果您的有效性很简单并通过字段属性进行控制，您可以使用 object.willValidate 进行测试并设置自定义有效性消息：

oninvalid =this.setCustomValidity（this.willValidate？''：'your custom message'）

I have this input code in my form:

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

I change the oninvalid message with this javascritp code:

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

 }
</script>

Here is the problem, if I clicked on submit and the field is empty, the field shome the error so I need to fill the field, but after fill the field, I still getting the warning even the fill is not empty.

What I'm doing wrong???

解决方案

You can set a custom validity message with setCustomValidity, however any non-blank string will cause the field to act as if it had an invalid value. You need to setCustomValidity('') to clear the invalidated state of the field.

If your validity is simple and controlled via field attributes, you can use object.willValidate to do the test and set the custom validity message:

oninvalid="this.setCustomValidity(this.willValidate?'':'your custom message')"

这篇关于修复输入字段后，html5 oninvalid不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！