1

Necesito validar una cadena de caracteres con solo 10 elementos pero sucede que para saltarse esta restricción los usuarios colocan uno o varios espacios en blanco y saltan este control.

El código es este:

function verificar_telefono() {
    var textotelefono = document.getElementById("telefono").value;
    var numerocaracterestextotelefono = textotelefono .length;

    if (numerocaracterestextotelefono < 10) {
        alert("El número de teléfono debe tener 10 dí­gitos);
        document.getElementById("telefono").value = "";
    }
}
4
  • A ver si entendendi. Necesitas que valide si tiene 10 caracteres, que no tenga espacio y que sean numeros?
    – Einer
    Commented el 29 nov. 2017 a las 22:35
  • 3
    Posible duplicado de JavaScript básico, validar cadena sin espacios
    – Dev. Joel
    Commented el 29 nov. 2017 a las 22:48
  • @juanitourquiza Tal cual estás preguntando, es un duplicado de esa pregunta. Sin embargo, creo que estás haciendo mal la pregunta. En vez de preguntar cómo validar el largo sin espacios, me parece que deberías preguntar cómo validar que tenga exactamente 10 dígitos.
    – Mariano
    Commented el 30 nov. 2017 a las 5:01
  • Se cambio la pregunta, en verdad como indicas de esa manera queda más clara y no se duplica porque resuelve un problema específico Commented el 30 nov. 2017 a las 5:05

4 respuestas 4

4

Estas son algunas de las muchas formas posibles:


1. Eliminemos todo lo que no es dígito

textoSoloDigitos = texto.replace( /\D+/g, "")

Y obtenemos el largo del string de sólo números con String.length.

cantDigitos = texto.replace( /\D+/g, "").length

Básicamente lo que hace es coincidir \D, un caracter que no es un dígito, que esté 1 o más veces (cuantificador +). Y reemplazarlo con String.replace() por "" para eliminarlos.

A eso, le sumamos el modificador /g para que busque todas las coincidencias, y no solo la primera.

Entonces,

if (textotelefono.replace(/\D+/g,"").length != 10) {
    // No tiene exactamente 10 dígitos
}


2. O veamos cuántos dígitos coinciden

cantDigitos = (texto.match(/\d/g) | []).length

Así, la condición para validar que tenga 10 dígitos, sin importar el resto de los caracteres, es:

if ((textotelefono.match(/\d/g) | []).length != 10) {
    //inválido
}

Para contar la cantidad de dígitos que tiene un texto, podemos usar la expresión regular /\d/ que coincide con eso, un caracter entre 0 y 9.

Al usar String.match(), se devuelve un array con todas las coincidencias (cada uno de los dígitos del string). El último paso es usar Array.length para contar la cantidad de elementos.



3. Código clásico

function cantDigitos(texto) {
    var largo = texto.length,
        caracter,
        contador = 0;

    for (var i = 0; i < largo; i++) { //recorremos cada caracter
        caracter = texto[i];
        if (caracter >= '0' && caracter <= '9') { //incrementando por cada dígito
            contador++;
        }
     }
     
     return contador;
}



// Prueba
var textotelefono = 'cel: (12) 3456 - 7890, abcde!!!';

var cantDigitosTelefono = cantDigitos(textotelefono);

if (cantDigitosTelefono != 10) {
    alert('No tiene 10 dígitos');
} else {
    alert('Número válido');
}



4. Validar que tenga 10 dígitos en un solo regex

Alternativamente, si se prefiere validarlo con una única expresión que garantice que tiene 10 dígitos:

/^(?:\D*\d){10}\D*$/

Como condición, usando RegExp.test():

var re = /^(?:\D*\d){10}\D*$/;
if (re.test(textotelefono)) {
    //válido
} else {
    //inválido
}

Descripción:

  • ^ ≝ coincide con la posición al inicio del string.
  • \D ≝ coincide con un caracter, cualquiera excepto dígitos.
  • \D* ≝ 0 a infinitos caracteres no dígitos.
  • \d ≝ coincide con un dígito.
  • (?:){10}(?:patrón) es un grupo, que lo usamos para que todo el patrón se repita 10 veces con el cuantificador {10}
  • \D* ≝ puede haber más caracteres no dígitos hasta el final.
  • $ ≝ coincide con la posición al final del string.
1

Como solución más sencilla puede Emplear el método Trim() para eliminar los espacios de los extremos antes de obtener la longitud con length , además le hace falta el cierre del string en el alert , (Quizá sea un error de tipeo al formular su pregunta) además si deseas solo 10 caracteres , la condición debería ser !== 10

function verificar_telefono() {
    var textotelefono = document.getElementById("telefono").value;
    var numerocaracterestextotelefono = textotelefono.trim().length;
    if (numerocaracterestextotelefono !== 10) {
        alert("El número de teléfono debe tener 10 dí­gitos");
        document.getElementById("telefono").value = "";
    }
}
<input type="text" id="telefono" >
<button onclick="return verificar_telefono()">ACEPTAR</button>

Si deseas evaluar , eliminando los espacios en blanco, puede emplear replace , pasando como primer parámetro un regex \s que remplazará (espacios, tabs, saltos de línea, retornos o saltos de página) por "" , Aquí la pregunta relacionada con esta opción

function verificar_telefono() {
    var textotelefono = document.getElementById("telefono").value;
    var valor = textotelefono.replace(/\s/g,'')
    var numerocaracterestextotelefono = valor.length;
    if (numerocaracterestextotelefono !== 10) {
        console.log("El número de teléfono debe tener 10 dí­gitos");
        document.getElementById("telefono").value = "";
    }else{
        console.log("Entrada Correcta " + valor);
    } 
}
<input type="text" id="telefono" >
<button onclick="return verificar_telefono()">ACEPTAR</button>

1
  • trim() elimina los espacios al principio y al final y no se si me equivoco pero entiendo que lo que quiere es eliminar todos los espacios.
    – Einer
    Commented el 29 nov. 2017 a las 22:28
0

Para quitar los espacios de la cadena usa esto:

var texto = texto.replace(/\s/g,"");

Ejemplo:

function myFunction() {
    var str = document.getElementById("demo").innerHTML; 
    var res = str.replace(/\s/g,"");
    document.getElementById("demo").innerHTML = res;
}
<p id="demo">Mr Blue has a blue house and a blue car.</p>

<button onclick="myFunction()">quitar espacios</button>

1
  • \s coincide con mucho más que espacios.
    – Mariano
    Commented el 30 nov. 2017 a las 4:58
-2

Para solucionar se utiliza la función replace antes de entrar a la condición:

function verificar_telefono() {
    var textotelefono = document.getElementById("telefono").value;
    var numerocaracterestextotelefono = textotelefono.replace(" ", "");
    numerocaracterestextotelefono = numerocaracterestextotelefono.length;
          
    if (numerocaracterestextotelefono < 10) {
        alert("El número de teléfono debe tener 10 dí­gitos, no se permite espacios en blanco. Ejemplo: 0999274778");
        document.getElementById("telefono").value = "";
    }
}
<input type="text" id="telefono" maxlength=10 >
<button onclick="return verificar_telefono()">ACEPTAR</button>

3
  • 1
    Si ejecutas: " hola como esta s ".replace(" ", "") retorna "hola como esta s ". No reemplaza todos espacios en blanco...
    – Einer
    Commented el 29 nov. 2017 a las 22:27
  • Bueno la idea del script fue validar un campo numerico dentro de toda la cadena si hay un espacion en blanco no completa la condicion y muestra el mensaje de error, al momento todos los registros de ese campo con este cambio a generado un ingreso de información correcta en un 100%. Puede ser que para casos como el que indicas se deba cambiar o mejorar el mismo. Commented el 29 nov. 2017 a las 22:34
  • Que termines aceptando tu propia respuesta, cuando ni siquiera resuelve el problema de la pregunta, teniendo respuestas que evidentemente son de mayor calidad, parece una falta de respeto a quienes invirtieron tiempo intentando ayudarte.
    – Mariano
    Commented el 4 dic. 2017 a las 20:28

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.