Eliminar espacios en Javascript

A veces nos puede hacer falta saber el contenido de una cadena en Javascript sin los espacios del principio y del final. Por ejemplo, es común hacer la siguiente validacion de un campo de un formulario para saber si esta vacío:

function valida() {
    if (document.forms['f'].campo.value == "") {
         alert('Campo vacio');
    }
}

O algún mañoso habrá intentado:

function valida() {
    if (document.forms['f'].campo.length == 0) {
         alert('Campo vacio');
    }
}

Estos dos sistemas funcionan, pero solo aparentemente. El usuario puede engañarte y meter un espacio, dejando el campo en blanco, pero que ocupa una posición (o más) y no es exactamente la cadena vacía (“”) con la que comparamos.
Podemos intentar algunos trucos para eliminar los espacios, pero buscando por internet, he encontrado el método más eficaz.

String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g, ""); };

Con esta línea, estamos declarando una función llamada trim() en la clase String. Es decir, que en cualquier cadena de texto podemos llamar al método trim() para que nos devuelva el contenido sin espacios por delante ni por detrás. La sustitución se hace con una expresión regular. Más elegante y sencillo imposible.
Ahora nuestra podemos completar nuestra validación como sigue:

String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g, ""); };
function valida() {
    if (document.forms['f'].campo.trim().length == 0) {
         alert('Campo vacio');
    }
}

Y aunque inserten espacios en blanco, funcionará.
De todas formas, siempre es más comodo utilizar alguna librería en Javascript de validación de formularios, además de volver a validar los parámetros en el servidor.

Un test de la función:

String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g, ""); };
var str = "   esto es una prueba   ";
alert("Cadena original: '" + str + "'");
alert("Sin espacios: '" + str.trim() + "'");

La función la he cogido de este post en Bigbold. Fijaos bien en los comentarios porque el primer método propuesto no funciona correctamente, he cogido el del primer comentarista. Ese es el que funciona y el que os acabo de poner aquí.

18 thoughts on “Eliminar espacios en Javascript

  1. Es increible que Java Script no tenga su propia función trum y que nosotros tengamos que crearla.

    Muchas gracias por la función.

    Att: Alex

  2. No tengo ni idea porque el ejemplo no funciona cuando lo pruebo, pongo esto entre la etiqueta head:


    Que puede estar mal????

    Salu2 Davo

  3. Esta bueno el scripts, pero si necesito valiar que no me ingrese una cadena determinada??
    Por ejemplo en la valida(), fijarme si ingresa la palabra “corresponda”, si es asi pedir de nuevo el input.

    Gracias,
    maximiliano Almada

  4. He aqui una alternativa al uso de expresiones regulares, sirve tanto para IE como para Mozilla:

    String.prototype.trim = function() {
    cad = this;
    while(cad.charAt(0)==” “) cad=cad.substring(1,cad.length);
    while(cad.charAt(cad.length-1)==” “) cad=cad.substring(0,cad.length-1);
    return cad;
    }

    • Mil gracias, esta funcion SI trabaja correctamente. Las demas dejan un espacio al ocmienzo y al final cuando la cadena inicia o finaliza con varios espacios

  5. Tengo una mas sencilla y efectiva:
    Esta funcion hace las veces de un trim

    function trim(cadena){
    // USO: Devuelve un string como el parámetro cadena pero quitando los espacios en blanco de los bordes.

    var retorno=cadena.replace(/^\s+/g,”);
    retorno=retorno.replace(/\s+$/g,”);
    return retorno;
    }

    Por ejemplo, si:

    micadena = ” Hola que tal ”
    micadena = trim(micadena)

    Devolvería “Hola que tal”

    No lo escribi yo, solo lo acomode un poco…saludos

  6. Por favor expliquen si es necesario cargar la libreria prototype, en que parte se agrega el código que indican… gracias!

  7. Prototype, ademas de una librería, es una propiedad que tienen todas las clases de javascript para poder manipular su estructura. Puedes copiar el codigo nada mas empezar en cualquier etiqueta

  8. mmm no se ustedes a mi me sirvio bastante esta info

    quite los caracteres inservivles que me arrojo una formula anterior con la siguiente funcion

    function (Cadena) {
    cadena=cadena.trim();
    return (cadena);
    }

  9. Publico funcion modificada, tomando como referencia la de Nando

    function trim(cadena)
    {
    var retorno=cadena.replace(/^\s+/g,””);
    retorno=retorno.replace(/\s+$/g,””);
    return retorno;
    }

    Y para aplicarla

    trim(descrip.value)

    Ejemplo: alert (“Prueba: “+trim(descrip.value) );

  10. Lo que publicó Ariel me funció perfecto
    function trim(cadena)
    {
    var retorno=cadena.replace(/^\s+/g,””);
    retorno=retorno.replace(/\s+$/g,””);
    return retorno;
    }

    Y para aplicarla

    trim(variable)

  11. HOla las funciones estan geniales pero como llamo esas funciones como llamo las funciones al input text q necesito para luego mandarlos a la BD????

  12. tome una de las opciones q aparecen en los comentarios y la simplifique, me funciona bien en firefox 4 :P

    function trim(c){ return c.replace(/(^\s+|\s+$)/g,””); }
    trim(variable)

Comments are closed.