La verdad es que casi todos los navegadores modernos ya incluyen dentro de sus plataformas un corrector ortográfico. Algo que no sucedía en las versiones más antiguas.
Una de las cosas que podemos hacer gracias a HTML5 es la de activar o desactivar el corrector ortográfico sobre un determinado elemento. Es decir, pasamos a tener control de esta característica del navegador.
El atributo que nos da el control sobre el corrector ortográfico con HTML5 es spellcheck. El atributo spellcheck está presente en todos los elementos del lenguaje HTML5. Los valores que puede tomar este atributo son «true» y «false». En el primer caso es para activar el corrector ortográfico y en el segundo caso es para deshabilitarlo. Por defecto, el valor que tiene este atributo es «true».
Así, si queremos inhabilitar el corrector ortográfico sobre un área de texto escribiríamos lo siguiente:
Pero no solo podemos jugar con los valores de este atributo en el código HTML5, si no que de forma dinámica, mediante Javascript, podemos modificar sus valores.
De esta forma vamos a añadir unos botones para habilitar y deshabilitar el corrector.
Ahora lo que haremos será capturar los eventos click de dichos botones para activar y desactivar el corrector respectivamente.
var boton = document.getElementById("validar");
var boton2 = document.getElementById("novalidar");
var texto = document.getElementById("texto");
boton.addEventListener("click",function(ev){
texto.spellcheck = true;
texto.focus();
},true);
boton2.addEventListener("click",function(ev){
texto.spellcheck = false;
texto.focus();
},true);
Vemos que sobre el elemento textarea, del cual obtenemos la referencia con .getElementById, manipulamos su atributo spellcheck asignándole «true» o «false».
