javascript - true - jquery mask tutorial

El complemento Jquery Masked Input permite dot

Question

Estoy usando el complemento de entrada JQuery Masked.

$("#percent").mask("99.99?9");

Esto permite números como 10.999, 10.99, 01.999, 01.99

Lo que quiero lograr es que no quiero que el usuario escriba 01.99 . En cambio, si el usuario escribe 1.99 , quiero 0 antes de que 1 se agregue automáticamente. Así es como empecé, pero no sé cómo continuar:

 //assume i typed in field 11.99
$(document).on(''keyup'', ''#percent'', function(evt) {
var input = $(this).val();
alert(input); // 11.99_
if(evt.which == ''190'' || evt.which == ''110'') {
//if dot is clicked
alert(parseInt(input)); // 11
}
});

Tenga en cuenta que la entrada de alerta imprime 11.99_ con guion bajo al final ya que el tercer valor es opcional y no lo he ingresado.

Ahora este valor es perfectamente normal pero si el usuario ingresara 1.99 , no podría, ya que automáticamente movería 9 hacia 1 para llenarlo con 2 dígitos, por lo que regresaría como 19.9 y esto no es válido ya que debe haber 2 decimales como se define arriba . Entonces, en mi sentencia if, quiero poder detectar si lo que se ingresó es menos de 10 , si es menos de 10 en puntos decimales, entonces agregue 0 al comienzo.

Ok, encontré una solución para underscore _ :

 $("#percent").mask("99.99?9", {placeholder: ""})

pero aún no soluciona otro problema al ingresar 1.99 siendo 19.9

Answer 1

Puede interceptar el comando de teclado para hacer esto, pero necesitará alguna forma de actualizar el estado del complemento.

El siguiente código funcionará:

$("#percent").bind({
keydown: function(e) {
// custom handler for dot
var userInput = parseFloat($("#percent").val());
if(e.which == ''190'' || e.which == ''110'') {
// if entered number is integer and less than 10
if(userInput % 1 === 0 && userInput < 10) {
// prevent default mask input handlers from calling
e.preventDefault();
e.stopImmediatePropagation();
// update value
$("#percent").val(''0''+userInput+''.'');
// simulate paste event to refresh mask input plugin state
$("#percent").trigger(''paste'').trigger(''input'');
}
}
}
}).mask("99.99?9", {placeholder: ""});

Trabajando JSFiddle aquí