2012-05-13 12 views
5

Mam pole wejściowe, które chcę ograniczyć, aby użytkownik mógł wprowadzić tylko liczbę z maksymalnie dwoma miejscami po przecinku. Chcesz to zrobić za pomocą jQuery.Ogranicz pole wejściowe do dwóch miejsc po przecinku za pomocą jQuery

Czy mogę jakoś użyć funkcji jQuery do funkcji Naprawiono()?

Thanx!

+0

Dlaczego chcesz używać jQuery? Możesz zrobić to samo za pomocą "maxlenght = 2" w html ... Następnie, jeśli chcesz mieć pewność, że użytkownik może wstawiać tylko miejsca po przecinku, możesz utworzyć funkcję o nazwie zdarzenia "onkeypress" – AleVale94

+0

Wygląda na to, że chcesz potwierdzić pole pieniędzy. Może to pomoże: http://javascriptbymallik.blogspot.com/2009/08/how-to-check-two-decimal-validation-in.html – Tim

Odpowiedz

8
$('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'); 
     } 
    }); 

Oto skrzypce http://jsfiddle.net/sabithpocker/PD2nV/

Korzystanie toFixed będzie zresztą przyczyną zbliżenia 123.6666 -> 123.67 Jeśli chcesz uniknąć przybliżenie sprawdzić tę odpowiedź Display two decimal places, no rounding

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

Wydaje się, że to tylko sprawdzanie długości wartości, a nie liczby miejsc dziesiętnych w wartości. –

+0

to samo co @PhilDD i to było jedno ")" – projo

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;" /> 

Poniższa funkcja ograniczy dziesiętne zgodnie z potrzebą miejsc dziesiętnych, a także ograniczyć więcej t han jedna kropka

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; 
     } 
    } 
} 
3

HTML5 rozwiązanie:

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

Demo

Jeśli chcesz stylu nieprawidłowych wejść (niektóre przeglądarki to zrobić domyślnie), można użyć :invalid selektora:

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

Uwaga: podejście to nie będzie próbowało skracać numeru automagicznie, ale jeśli użytkownik wprowadzi więcej niż dwie cyfry dziesiętne, wejście staną się nieważne, a więc forma nie zostaną przedłożone:

Screenshot on Firefox

2

Alternatywnym podejściem z wyrażenia regularnego:

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

Selektor id może być zastąpiony przez selektor CSS.

0
<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> 
Powiązane problemy