2009-01-08 14 views
6

jquery tiene cualquier complemento que impida ingresar cualquier entrada a un cuadro de texto que no concuerde con un patrón de expresiones regulares. por ejemplo, tengo un cuadro de texto para ingresar el monto del pago, quiero que el usuario pueda ingresar solo numebers y. en el cuadro de texto, el resto de la entrada no tendrá ningún efecto en el cuadro de texto ..jquery plugin para evitar el ingreso de cualquier entrada que no concuerde con una expresión regular

gracias

Respuesta

6

Masked Input Plugin

jQuery(function($){ 
    $("#paymentAmount").mask("9999.99"); 
}); 
+0

no va a ayudar, porque, de entrada enmascarada crea una máscara, que controla el formato pero no realmente útil para que coincida con una expresión regular –

+0

Si desea deshabilitar la capacidad de ingresar ciertos caracteres en un cuadro de texto, entonces una máscara es su mejor opción. ¿Cuán complicadas son sus reglas que necesita expresiones regulares para ellas? – Bob

+0

Bob tiene razón, mira mi respuesta para saber qué tan complicadas pueden ser las cosas si insistes en expresiones regulares. Podría incorporar la respuesta de Meouw también para un mejor manejo de los eventos de keydown incluso antes de que lleguen al cuadro de texto, pero eso complica aún más las cosas. Enmascarar la entrada es probablemente lo mejor. –

1

eventos de teclado son un poco complicado como se sugiere en la documentación de jQuery.
http://unixpapa.com/js/key.html
http://yehudakatz.com/2007/07/03/event-normalization-in-jquery-113/

La dificultad que le preocupa es la siguiente:

La identificación de llaves
Cuando se captura un evento de teclado, puede que desee saber qué tecla se ha pulsado. Si es así, puede estar pidiendo demasiado. Este es un gran lío de incompatibilidades y errores del navegador.
Desde el primer enlace anterior

De todos modos, en jQuery que haría esto:

textBoxElement.keydown(function(e) { 
    var chr = String.fromCharCode(e.which); 
    if(!/[0-9.]/.test(chr)) { 
     e.preventDefault(); 
    } 
} 

Esto también deshabilitar otras claves importantes como entrar, ficha, borrar, por lo que necesitan para ser agregado al condicional. No todas las otras claves son imprimibles y por lo tanto no pueden ser regestadas, por lo que deberá verificar su e.keyCode. 13, 8, etc.

Si usted no está demasiado preocupan de la expresión regular que podría hacer algo como

textBoxElement.keydown(function(e) { 
    switch(e.keyCode) { 
     case 48: //0 
     case 49: //1 
     case 50: //2 
     case 51: //3 
     case 52: //4 
     case 53: //5 
     case 54: //6 
     case 55: //7 
     case 56: //8 
     case 57: //9 
     case 48: //10 
     case 37: //left 
     case 39: //right 
     case 8: //tab 
     case 13: //return 
     case 46: //del 
     case 190: //. 
      return; 
    } 
    e.preventDefault(); 
}); 
1

No creo que exista tal plug-in fácilmente disponibles. El problema es un poco complicado, porque tienes que permitir que el usuario escriba alguna entrada antes de aplicar tu expresión regular. Es decir, no puede coincidir con cada carácter como se escribe, a menos que su expresión regular simplemente defina un conjunto de caracteres.

Para ilustrar, si están ingresando un monto de pago, y desea permitir números y decimales en un solo carácter, ¿qué les impide ingresar al 99.99.23.42492?

Por otro lado, si proporciona una expresión regular completa como /\d+\.\d{2}/, no coincidirá en absoluto con un solo carácter, deberá permitir que escriban cierta cantidad de caracteres antes de intentar aplicar la expresión regular y borrando su entrada si no coincide. Eso podría ser frustrante.

Si realmente desea filtrar la entrada mientras escriben, entonces desea permitir un dígito para el primer carácter, luego dígitos o un decimal para los caracteres siguientes hasta que se ingrese el decimal, y luego dos dígitos más, y luego no más entrada. No es un filtro de propósito general.

Por ejemplo, aquí hay un código que lo hará, pero es muy feo.

myInput.keydown(function() { 
     var text = this.val 
     if(!/^\d/.test(text)) { 
      return ''; 
     } else { 
      done = text.match(/^(\d+\.\d\d)/); 
      if (done) { return done[0]; } 

      last_char = text.substr(text.length-1,1); 
      decimal_count = text.replace(/[^\.]/g,'').length; 

      if (decimal_count < 1) { 
      if (!/[\d\.]/.test(last_char)) { 
       return text.substr(0,text.length-1); 
      } 
      } else if (decimal_count == 1 && last_char == '.') { 
      return text; 
      } else { 
      if (!/[\d]/.test(last_char)) { 
       return text.substr(0,text.length-1); 
      } 
      } 
      return text; 
     } 
    }); 

Y, por supuesto, esto no funcionará si pasan a pegar ciertos valores sin hacer tipeo "real".

¿Tal vez algún otro enfoque funcionaría mejor para usted?Como resaltar el campo e indicar al usuario si ingresa un dígito que no sea un dígito, no decimal, o si ingresa más de un decimal, en lugar de filtrar la entrada en sí, porque eso parece desordenado.

0

Aquí es una extensión de jQuery sencilla que utilizo:

jQuery.fn.DecimalMask = function() { 
    return this.each(function() { 
    $(this).keypress(function (e) { 
     var keynum; 
     if (window.event) // IE 
     { 
     keynum = e.keyCode; 
     } 
     else if (e.which) // Netscape/Firefox/Opera 
     { 
     keynum = e.which; 
     } 
     if (typeof keynum == 'undefined') return true; 
     else if (keynum == 46 && $(this).val().indexOf(".") > -1) return false; //already has a decimal point 
     else return ((keynum > 47 && keynum < 58) || keynum == 13 || keynum == 8 || keynum == 9 || keynum == 46 || keynum == 45); //allow ony number keys or keypad number keys 
    }); 
    }); 
}; 
//implementation 
$("#mytxtbox").DecimalMask(); 
Cuestiones relacionadas