Quiero validar números en una entrada en Javascript.
La entrada debe aceptar:
empty input '' positive number '123' decimal number '23.89' '23.88888' '.89'Pero no debería aceptar números negativos y también '0.-99'. He usado esta expresión regular:
pattern="/[+]?[0-9]+\.?[^-]?[0-9]*/";Pero acepta 0.-99 . ¿Cuál es la expresión regular correcta para no aceptar .-99?
Prueba esto:
/^([.\d][\d]*\.?[\d]+)/g / ^ beginning of the input ( [.\d] starting charater of the input should be either a '.', or a digit [\d]+ then any number of digits after the first character \.? matches the decimal '.', ? indicates that it is optional [\d]+ matches digits after the decimal position ) / g js re global flagPruebe esta expresión regular aquí: https://regex101.com/r/c5ELUl/1
El siguiente código de ejemplo proporcionado presenta tanto una validación final como una desinfección inmediata del valor de entrada. Ambas tareas están basadas en expresiones regulares.
El primero cubre los criterios de aceptación del OP... el patrón es el siguiente... /^(?<=-*)\+?\d*\.?\d+$|^(?<=-*)\+?\d+\.$/ .
Este último restringe la entrada del usuario mientras se continúa escribiendo o se copia y pega... el patrón se basa en la validación pura más estricta anterior... /^(?<=-*)(?<sign>\+?)(?<integer>\d*)(?<point>\.?)(?<float>\d*)/ .
function isValidNumberValue(value) { value = String(value); return ( (value === '') || (/^(?<=-*)\+?\d*\.?\d+$|^(?<=-*)\+?\d+\.$/).test(value) // see ... [https://regex101.com/r/ddMyLD/4] //(/^(?<=-*)\+?\d*\.?\d+$/).test(value) // // see ... [https://regex101.com/r/ddMyLD/2] ); } function validateNumberValue({ currentTarget }) { currentTarget.classList.toggle('invalid', !isValidNumberValue(currentTarget.value)); } function resetValidation({ currentTarget }) { currentTarget.classList.remove('invalid'); } function sanitizeImmediately({ currentTarget }) { let { value } = currentTarget; value = value.trim(); const { sign = '', integer = '', point = '', float = '' } = (/^(?<=-*)(?<sign>\+?)(?<integer>\d*)(?<point>\.?)(?<float>\d*)/) // see ... [https://regex101.com/r/ddMyLD/1] .exec( currentTarget.value.trim() ) ?.groups ?? {}; currentTarget.value = [sign, integer, point, float].join(''); } function init() { const control = document.querySelector('[type="text"]'); control.addEventListener('input', sanitizeImmediately); control.addEventListener('focusin', resetValidation); control.addEventListener('focusout', validateNumberValue); } init(); console.log( "isValidNumberValue('') ?..", isValidNumberValue('') ); console.log( "isValidNumberValue(' ') ?..", isValidNumberValue(' ') ); console.log( "isValidNumberValue('-0') ?..", isValidNumberValue('-0') ); console.log( "isValidNumberValue('0') ?..", isValidNumberValue('0') ); console.log( "isValidNumberValue(.45) ?..", isValidNumberValue(.45) ); console.log( "isValidNumberValue(-.45) ?..", isValidNumberValue(-.45) ); console.log( "isValidNumberValue('.-45') ?..", isValidNumberValue('.-45') ); console.log( "isValidNumberValue(99.432) ?..", isValidNumberValue(99.432) ); console.log( "isValidNumberValue('+9.43') ?..", isValidNumberValue('+9.43') ); console.log( "isValidNumberValue('+9.43.45') ?..", isValidNumberValue('+9.43.45') ); console.log( "isValidNumberValue('5.') ?..", isValidNumberValue('5.') ); console.log( "isValidNumberValue('.') ?..", isValidNumberValue('.') ); body { margin: 0; } [type="text"].invalid { border-color: #b00; background-color: #fddddd; } .as-console-wrapper { min-height: 88%!important; } <input type="text" maxlength="16" />