Restringi il campo di input a due decimali con jQuery

Question

Ho un campo di input che voglio limitare in modo che l'utente possa solo inserire un numero con il massimo di due decimali. Vuoi farlo usando jQuery.

Posso utilizzare la funzione jQuery toFixed() in qualche modo?

Grazie!

Answer 1

$('input#decimal').blur(function(){ 
    var num = parseFloat($(this).val()); 
    var cleanNum = num.toFixed(2); 
    $(this).val(cleanNum); 
    if(num/cleanNum < 1){ 
     $('#error').text('Please enter only 2 decimal places, we have truncated extra points'); 
     } 
    }); 

Ecco un violino http://jsfiddle.net/sabithpocker/PD2nV/

Utilizzando toFixed sarà comunque causare approssimazione 123.6666 -> 123.67 Se si vuole evitare di controllare questa risposta approssimazione Display two decimal places, no rounding

Answer 2

$("#myInput").focusout(function() { 
    if ($(this).val().length > 2 || isNaN(Number($(this).val())) { 
     alert("Wrong number format"); 
    } 
}); 

Answer 3

<input type="text" name="amount1" id="amount1" class="num_fld Amt" onkeypress="return check_digit(event,this,8,2);" size="9" value="" maxlength="8" style="text-align:right;" /> 

La seguente funzione limita decimali in base al tuo bisogno di posti decimali e anche limitare più t han un punto

function check_digit(e,obj,intsize,deczize) { 
    var keycode; 

    if (window.event) keycode = window.event.keyCode; 
    else if (e) { keycode = e.which; } 
    else { return true; } 

    var fieldval= (obj.value), 
     dots = fieldval.split(".").length; 

    if(keycode == 46) { 
     return dots <= 1; 
    } 
    if(keycode == 8 || keycode == 9 || keycode == 46 || keycode == 13) { 
     // back space, tab, delete, enter 
     return true; 
    }   
    if((keycode>=32 && keycode <=45) || keycode==47 || (keycode>=58 && keycode<=127)) { 
     return false; 
    } 
    if(fieldval == "0" && keycode == 48) { 
     return false; 
    } 
    if(fieldval.indexOf(".") != -1) { 
     if(keycode == 46) { 
      return false; 
     } 
     var splitfield = fieldval.split("."); 
     if(splitfield[1].length >= deczize && keycode != 8 && keycode != 0) 
      return false; 
     }else if(fieldval.length >= intsize && keycode != 46) { 
      return false; 
     }else { 
      return true; 
     } 
    } 
} 

Answer 4

Una soluzione HTML5:

<input type="number" step="0.01" /> 

Demo

Se si vuole ingressi validi stile (alcuni browser lo fanno per impostazione predefinita), è possibile utilizzare :invalid selettore:

input:invalid { box-shadow: 0 0 1.5px 1px red; } 

Nota questo approccio non tenterà di troncare il numero automaticamente, ma se l'utente immette più di due cifre decimali, l'ingresso non sarà più valido, e quindi non verrà inviato il modulo:

Answer 5

Prova questo per tutti i simboli:

inputField.value .replace (/(\...)(.)/, "$ 1");

o questo per i numeri:

inputField.value.replace (./(\ [0-9] [0-9]) ([0-9]) /, "$ 1");

ho trovato questo metodo qui: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Example:_Switching_words_in_a_string

Answer 6

Un approccio alternativo con un'espressione regolare:

$('#id').on('input', function() { 
     this.value = this.value.match(/^\d+\.?\d{0,2}/); 
    }); 

Il selettore id può essere sostituita da un selettore css.

Answer 7

<input type="text" id="decCheck" onkeyup="decimalCheck();"/> 

<script> 
function decimalCheck(){ 
var dec = document.getElementById('decCheck').value; 
if(dec.includes(".")){ 
    var res = dec.substring(dec.indexOf(".")+1); 
    var kl = res.split(""); 
    if(kl.length > 1){ 
    document.getElementById('decCheck').value=(parseInt(dec * 100)/
     100).toFixed(2); 
    } 
    } 
} 
</script>