Javascript regex

Javascript regex
Al desarrollar sitios web, la validación de formulario es una actividad crucial que ayuda a verificar la integridad de los datos y prevenir problemas de seguridad. Los nombres de usuario son un tipo típico de entrada del usuario en el formulario que se utiliza para identificar a las personas en sitios web y aplicaciones. Validar los nombres de usuario puede ayudar a garantizar que cumplan con estándares particulares, como los límites de carácter y longitud.

Este artículo describirá el procedimiento para validar el nombre de usuario utilizando regex en JavaScript.

Cómo validar el nombre de usuario usando JavaScript regex?

Para validar el nombre de usuario, primero, cree una expresión regular que determine si el valor de entrada del usuario coincide con el patrón dado. Luego, utiliza el "prueba()Método para la verificación de la entrada del usuario de acuerdo con el patrón.

Siga el patrón dado para tomar una entrada que contiene solo letras, números y ambos, pero no permite ingresar a ningún carácter especial:

var regexPattern = /^[A-ZA-Z0-9]+$ /;

El patrón dado permitirá solo letras con números, y no permite ingresar solo números, letras y caracteres especiales en entrada:

var regexPattern =/^(?=.*[A-ZA-Z]) (?=.*[0-9]) [A-ZA-Z0-9]+$/;

Consejo de bonificación: También puede especificar la longitud del nombre de usuario en su patrón.

Use la sintaxis dada para el "prueba()Método para verificar la entrada de acuerdo con el patrón regex:

patrón.Prueba (entrada)

Ejemplo 1: el nombre de usuario contiene solo números, letras, y ambos caracteres especiales no están permitidos

Primero, cree un formulario en un documento HTML usando la etiqueta que contiene un campo de entrada y un botón de envío. Adjuntar un "al hacer clic"Evento con el botón que llamará al"validateUsername ()"Función en el clic del botón:







En la etiqueta, definiremos una función llamada "validateUsername ()"Eso se activará en el clic del botón:

función validateUsername ()

var inputValue = documento.getElementById ("Entrada").valor;
var regexPattern = /^[A-ZA-Z0-9]+$ /;
if (regexpattern.Prueba (InputValue))

alerta ("El nombre de usuario es válido");
devolver verdadero;

demás

alerta ("ingrese un nombre de usuario válido");
falso retorno;

En la función definida anteriormente:

  • Primero, obtenga la referencia del campo de entrada utilizando el "documento.getElementById ()"Método y luego recuperar el valor de entrada del usuario con la ayuda del"valor" atributo.
  • Definir un patrón para validar el nombre de usuario.
  • Luego, utiliza el "texto()Método "con un patrón y tome la entrada como un argumento para verificar si la entrada está de acuerdo con el regex o no.
  • Si el valor de entrada es equivalente al patrón, el mensaje de alerta "El nombre de usuario es válido"Se muestra, de lo contrario, el cuadro de alerta muestra el"Ingrese un nombre de usuario válido" mensaje:

Producción

Ejemplo 2: el nombre de usuario contiene letras con números, solo no se permiten números o solo letras

En este ejemplo, utilizaremos el Regex para tomar una entrada que contiene letras con números, solo dígitos, letras o caracteres especiales con letras o números no están permitidos. Para esto usaremos el patrón dado en el "validateUsername ()" función:

var regexPattern =/^(?=.*[A-ZA-Z]) (?=.*[0-9]) [A-ZA-Z0-9]+$/;

La salida muestra que cuando el usuario ingresa solo dígitos, letras o nombre de usuario con una letra, número y carácter especial, un mensaje de alerta "Ingrese un nombre de usuario válido" se muestra. Al ingresar la entrada que contiene letras y números, le da un mensaje "El nombre de usuario es válido":

Eso se trata de la validación del nombre de usuario en JavaScript usando regex.

Conclusión

Para validar el nombre de usuario, use la expresión regular o el patrón de regex de acuerdo con sus requisitos. Aquí, en este artículo discutimos dos patrones; "/^[A-ZA-Z0-9]+$/;" y "/^(?=.*[A-ZA-Z]) (?=.*[0-9]) [A-ZA-Z0-9]+$/;". El primer patrón toma la entrada solo con letras, números y ambos, pero no permite ingresar ningún carácter especial. Mientras que el segundo patrón no permite ingresar solo letras y dígitos como nombre de usuario. Para validar la entrada de acuerdo con el patrón, el "prueba()Se utiliza el método ". Este artículo describió el procedimiento para validar el nombre de usuario utilizando regex en JavaScript.