La comprobación gramatical viene activada por defecto con muchos navegadores, pero puedes desactivarla mediante el atributo spellcheck, aceptado por cualquier campo <input> o <textarea>, pudiendo establecer su valor como true o como false según quieras activar o desactivar la comprobación ortográfica.
Activa o desactiva la comprobación ortográfica
Para activar la comprobación gramatical debes establecer el valor del atributo spellcheck como true:
<!-- Activa la comprobación gramatical -->
<input type="text" spellcheck="true">Para desactivar la comprobación gramatical debes establecer el valor del atributo spellcheck como false:
<!-- Desactiva la comprobación gramatical -->
<input type="text" spellcheck="false">Deberías activar o desactivar la comprobación ortográfica en función del tipo de contenido que vaya a contener el campo de texto. Por ejemplo, no tendría sentido activarla si el campo contiene código HTML, JavaScript o código de cualquier otro lenguaje de programación.
De todos modos, la comprobación gramatical puede ser ignorada por el usuario mediante la configuración de su navegador. Por ejemplo, en Firefox puedes activar o desactivar la opción layout.spellcheckDefault de la configuración del navegador accediendo a la URL about:config, activando o desactivando la comprobación ortográfica en función de si el valor de la opción es 1 o 0 respectivamente.
También es posible usar el atributo spellcheck con otros elementos como podrían ser elementos <div> o <span>. En este caso, cualquier elemento <input> o <textarea> que esté en su interior heredará el valor del atributo spellcheck de sus elementos padres, siempre y cuando estos elementos no tengan definido el atributo spellcheck.
A continuación puedes ver un ejemplo en el que la comprobación ortográfica estará activada para el elemento <input> que definimos, ya que el atributo spellcheck es heredado de su padre:
<div spellcheck="true">
<input type="text">
</div>Cambia el idioma de la comprobación ortográfica
También podemos cambiar el idioma de la comprobación ortográfica mediante el atributo lang, que nos permitirá modificar el idioma en el que estará el texto de los campos <input> o <textarea>. Sin embargo, la comprobación de errores de idiomas diferentes al del navegador de usuario solamente funcionará si el navegador dispone del diccionario del idioma especificado.
En el siguiente ejemplo, la comprobación gramatical del elemento <textarea> se realizará en inglés:
<textarea lang="en"></textarea>También es posible heredar el atributo lang. En el siguiente ejemplo, la comprobación gramatical del elemento <textarea> definido se realizará en francés:
<html lang="es">
<body>
<div spellcheck="true">
<textarea></textarea>
</div>
</body>
</html>En caso de no especificar ningún idioma, el idioma que se usará por defecto para la comprobación gramatical será siempre el idioma del navegador del usuario.
Edu Lázaro: Ingeniero técnico en informática, actualmente trabajo como desarrollador web y programador de videojuegos.
