¿Hay navegadores compatibles con el método checkValidity() de HTML5?

La especificación HTML5 define algunos componentes de validación muy interesantes, incluyendo pattern (para validar contra una Regexp) y required (para marcar un campo como requerido). Sin embargo, lo mejor que puedo decir es que ningún navegador realmente realiza ninguna validación basada en estos atributos.¿Hay navegadores compatibles con el método checkValidity() de HTML5?

Encontré comparison of HTML5 support across engines, pero no hay información acerca de la validación allí. En los navegadores que he probado (Firefox 3.5.8 y Safari 4.0.4), ningún objeto tiene un método checkValidity(), por lo que no puedo ejecutar las validaciones aunque puedo definirlas.

¿Existe alguna compatibilidad con esta función para que pueda experimentar?

Fuente

2010-03-10 James A. Rosen

He probado lo siguiente en Google Chrome:

<!DOCTYPE html> 
<html> 
    <body> 
    <style> 
     .valid { color: #0d0; } 
     .invalid { color: #d00; } 
    </style> 
    <div id="output"></div> 
    <script> 
     function check(input) { 
     var out = document.getElementById('output'); 
     if (input.validity) { 
      if (input.validity.valid === true) { 
      out.innerHTML = "<span class='valid'>" + input.id + 
          " is valid</span>"; 
      } else { 
      out.innerHTML = "<span class='invalid'>" + input.id + 
          " is not valid</span>"; 
      } 
     } 
     console.log(input.checkValidity()); 
     }; 
    </script> 
    <form id="testform" onsubmit="return false;"> 
     <label>Required: 
     <input oninput="check(this)" id="required_input" 
       required /> 
     </label><br> 
     <label>Pattern ([0-9][A-Z]{3}): 
     <input oninput="check(this)" id="pattern_input" 
       pattern="[0-9][A-Z]{3}"/> 
     </label><br> 
     <label>Min (4): 
     <input oninput="check(this)" id="min_input" 
       type=number min=4 /> 
     </label><br> 
    </form> 
    </body> 
</html>

stangely, la propiedad <element>.validity.valid parece funcionar correctamente, pero llamar <element>.checkValidity() siempre devuelve verdadero, por lo que parece que no está implementado todavía.

Fuente

2010-03-10 23:12:50

es necesario llamar a checkValidity en el formulario, no las entradas – miketaylr

¿Dónde se ve que http..:.? //dev.w3.org/html5/spec/Overview.html dice que checkValidity es una función miembro en HTMLObjectElement y: "Cuando se invoca el método checkValidity(), si el elemento es candidato para la validación de restricciones ... el agente de usuario debe disparar un evento simple llamado inválido que es cancelable ... en el elemento y devolver falso. " La misma especificación define" candidato para validación de restricción "como" Un elemento asociado a formulario enumerado es un candidato para la validación de restricción excepto cuando una condición ha impedido que el elemento valide la restricción. " Parece que se aplican las entradas –

fue que al llamar 'checkValidity()' en el formulario simplemente delegaría en cada uno de sus 'input's (y' select's y 'textarea's) sucesivamente, pero no puedo decir que realmente tengo una referencia para eso –

Según Dive into HTML5:

Cuando un usuario de Opera intenta enviar un formulario con un campo, Opera ofrece automáticamente la validación de correo electrónico compatible con RFC, aunque scripting está deshabilitado. Opera también ofrece validación de direcciones web ingresadas en campos y números en campos. La validación de números incluso tiene en cuenta los atributos mínimo y máximo, por lo que Opera no le permitirá enviar el formulario si ingresa un número que es demasiado grande.

(El párrafo citado se trata de la última en el artículo.)

Por lo que yo soy consciente -y teniendo en cuenta que no hemos probado con Opera 10, estoy tomando la palabra para ello, ningún otro navegador valida formularios de forma automática.

Fuente

2010-03-10 22:47:03

Opera 10 tiene alguna validación de formulario HTML5 http://dev.opera.com/articles/view/improve-your-forms-using-html5/. Pero, no creo que tenga checkValidation().

Fuente

2010-03-10 22:52:34 Adam

Sure. Opera y Chromium. Pero usted puede probarse:

function supportsValidity(){ 
    var i = document.createElement('input'); 
    return typeof i.validity === 'object' 
}

Aquí hay un enlace a una caja de arena donde se puede ver la Opera y Chrome en acción: http://jsfiddle.net/vaZDn/light/

Fuente

2010-03-11 01:19:46 miketaylr

También funciona en firefox 4.0 .1 –

También funciona en IE 10 – Johannes

Si se refiere a checkValidity() entonces, sí, Opera lo soporta.

Disclosurey thang: Trabajo para Opera.

Fuente

2011-11-23 14:57:25 bruce

Ya que trabajas allí ... hay alguna posibilidad de que puedas arrojar algo de luz sobre el hilo de comentarios anterior ... ¿se supone que funciona o no en el formulario principal? http://stackoverflow.com/questions/2421218/do-any-browsers-yet-support-html5s-checkvalidity-method#comment2405975_2421394 –

checkValidity() se supone que funciona tanto en el formulario como en una entrada individual o individual.

"Además, el método checkValidity() se puede ejecutar en un campo individual o en el formulario como un todo, y devuelve verdadero o falso. Ejecutar el método también activará programáticamente el evento no válido para todos los campos no válidos o, si ejecutado en un solo campo, solo para ese elemento ".

tomado de una lista Aparte - http://www.alistapart.com/articles/forward-thinking-form-validation/

"forma.checkValidity() Devuelve verdadero si los controles del formulario son todos válidos; de lo contrario, devuelve falso. " http://www.w3.org/TR/2011/WD-html5-20110525/association-of-controls-and-forms.html#constraint-validation

" valid = element. checkValidity() Devuelve verdadero si el valor del elemento no tiene problemas de validez; falso de lo contrario. Se dispara un evento no válido en el elemento en este último caso " http://www.w3.org/TR/2011/WD-html5-20110525/forms.html#client-side-form-validation

W3C - borrador de trabajo

Fuente

2012-10-12 15:22:15 cpi

¿Hay navegadores compatibles con el método checkValidity() de HTML5?

Respuesta

Cuestiones relacionadas