Tengo un problema con las expresiones regulares.
En mi código tengo una entrada cuando un jugador puede escribir su nombre y luego hacer clic en el botón 'start'
para comenzar la aventura.
La primera condición está funcionando bien. El jugador recibe un error cuando el nombre no tiene entre 4 y 20 caracteres.
Cuando se trata de la siguiente condición. El jugador obtiene un error sin importar lo que escriba dentro de la entrada. Cuando cambié match()
a test()
hay un error en la consola, que test()
no es una función.
Por favor ayúdenme, ¿qué hice mal?
let actualPlace = 'mainMenu'; let playerName = ''; const playerNameContainer = document.querySelector('.playerName'); const start = document.querySelector('.start'); const regExpression = /^[a-zA-ZżźćńółęąśŻŹĆĄŚĘŁÓŃ0-9]$/; start.addEventListener('click', function(){ if (actualPlace == 'mainMenu') { playerNameValue = playerNameContainer.value; playerNameLength = playerNameValue.length; if (playerNameLength >= 4 && playerNameLength <= 20) { if (playerNameValue.match(regExpression)) { actualPlace = 'adventure'; playerName = playerNameContainer.value; playerNameContainer.value = ''; } else { errorMsg.innerHTML = 'error'; } } else { errorMsg.innerHTML = 'error'; } } })
su expresión regular coincide con un solo carácter; necesita agregar el cuantificador +
para que coincida con más de un carácter.
También agregué diferentes errores para que sepas qué parte está fallando.
Aquí es un ejemplo de trabajo:
let actualPlace = 'mainMenu'; let playerName = ''; const playerNameContainer = document.querySelector('.playerName'); const start = document.querySelector('.start'); const regExpression = /^[a-zA-ZżźćńółęąśŻŹĆĄŚĘŁÓŃ0-9]+$/; const errorMsg = document.querySelector('.error'); start.addEventListener('click', function(){ if (actualPlace == 'mainMenu') { playerNameValue = playerNameContainer.value; playerNameLength = playerNameValue.length; if (playerNameLength >= 4 && playerNameLength <= 20) { if (playerNameValue.match(regExpression)) { actualPlace = 'adventure'; playerName = playerNameContainer.value; playerNameContainer.value = ''; errorMsg.innerHTML = 'Success!'; } else { errorMsg.innerHTML = 'error: your name must not contain spetial characters'; } } else { errorMsg.innerHTML = 'error: your name must be between 4 and 20 characters'; } } })
<input class="playerName" /><br /> <button class="start" >Start</button> <div class="error" ></div>