2013-06-20 8 views
10

ich versuche, ein Eingabefeld zu erstellen, wo der Benutzer nur Zahlen eingeben kann. Diese Funktion arbeitet bereits fast gut für mich:jquery keyup Funktion überprüfen, ob Nummer

 $('#p_first').keyup(function(event){ 
     if(isNaN(String.fromCharCode(event.which))){ 
      var value = $(this).val(); 

      $(this).val(value.substr(0,value.length-1)); 
     } 
    }); 

aber das Problem ist, WHE der Benutzer den Schlüssel mit einem Zeichen hält die Funktion keyup nicht auslösenden .... irgendwelche Ideen, wie ich dies verbieten kann?

+0

hält den Schlüssel? Gegeben ein bisschen mehr Beschreibung der Ursache des Problems? –

+0

jeder Schlüssel ... Eingabe Typ = Text ... und der Benutzer hält zum Beispiel "aaaaaaaaaaaaaaaa", so dass die Funktion keyup() nicht auslöst, bis er aufhört, die Taste "a" –

+0

Danke für die Bereitstellung von mehr Problem, denke ich Meine vorgeschlagene Lösung sollte Ihr Problem lösen. –

Antwort

22

Versuchen Sie, statt keyup an das Ereignis keypress zu binden. Es wird wiederholt ausgelöst, wenn eine Taste gedrückt wird. Wenn die gedrückte Taste keine Nummer ist, können Sie preventDefault() anrufen, wodurch der Schlüssel nicht im Eingabe-Tag platziert wird.

$('#p_first').keypress(function(event){ 

     if(event.which != 8 && isNaN(String.fromCharCode(event.which))){ 
      event.preventDefault(); //stop character from entering input 
     } 

    }); 

Arbeitsbeispiel:http://jsfiddle.net/rTWrb/2/

+0

Ich habe versucht, aber der neue Charakter ist, während die Funktion Tastendruck läuft nicht im Textfeld noch, so kann ich es nicht mit substr() –

+0

@AdamSam siehe aktualisiert Vorschlag –

+0

erstaunlich! danke;) –

0

diese Lösung Versuchen:

jQuery('.numbersOnly').keyup(function() { 
    this.value = this.value.replace(/[^0-9\.]/g,''); 
}); 

Demo: http://jsfiddle.net/DbRTj/

gleichen Fragen:

+0

Wenn ich die Tasten der rechten Seite benutze t gut arbeiten. –

+0

@IagoMelanias Was meinst du? Sie sprechen über die zweite Eingabe ODER über den Themenstartercode? – webdeveloper

+0

Ich spreche über Ihren Code. Wenn ich die Tasten auf der rechten Seite meiner Tastatur verwende, funktioniert es nicht. –

-1
JavaScript: 

    function isNumberKey(a){ 
    var x=a.val(); 
    a.val(x.replace(/[^0-9\.]/g,'')); 

} 

HTML: 

    <td><input type="text" name="qty" onkeypress="onkeyup="return isNumberKey($(this));"" value="" style="width:100px;" field="Quantity" class="required"></td> 
+0

Dies gibt True für Escape zurück? – jeff

+0

Das ist falsch, da es keine Nummernblock-Tasten berücksichtigt, die einen anderen Code haben. Bitte, siehe die alternative Antwort. –

+0

Diese Funktion gibt true zurück, wenn die Eingabe nur die Nummer ist. –

0

Versuchen This..it usefull kann.

<HTML> 
<input type="text" name="qty" id="price" value="" style="width:100px;" field="Quantity" class="required"> 
</HTML> 

<script> 
$(document).ready(function() { 
$('#price').live('keyup',function(){ 
     this.value = this.value.replace(/[^0-9\.]/g,''); 
     }); 
}); 
</script> 
2

Ich beschloss, die von @Rahul Yadav vorgesehen Antwort zu verwenden, aber es ist falsch, da es nicht Num-Pad-Tasten betrachten, die verschiedenen Codes.

Hier kann die Funktion I umgesetzt:

Hier können Sie eine excerpt of the code table sehen

function isNumberKey(e) { 
var result = false; 
try { 
    var charCode = (e.which) ? e.which : e.keyCode; 
    if ((charCode >= 48 && charCode <= 57) || (charCode >= 96 && charCode <= 105)) { 
     result = true; 
    } 
} 
catch(err) { 
    //console.log(err); 
} 
return result; 

}

2

Der beste Weg ist, Wert des Eingangs zu überprüfen, statt gedrückter Taste. Weil es Tabulatoren, Pfeile, Rücktaste und andere Zeichen gibt, die überprüft werden müssen, wenn Sie Zeichencode verwenden.

Die Codeprüf Eingangswert nach dem Benutzer eine Taste gedrückt:

$('#p_first').keyup(function(){ 
    while(! /^(([0-9]+)((\.|,)([0-9]{0,2}))?)?$/.test($('#p_first').val())){ 
     $('#p_first').val($('#p_first').val().slice(0, -1)); 
    } 
}); 

While-Schleife letzte Zeichen entfernen, bis Eingabewert gültig ist. Regex /^(([0-9]+)((\.|,)([0-9]{0,2}))?)?$/ validate Integer und Float-Nummer z. "12,12", "12,1", "12". Es ist wichtig, dass die Nummer "12." (Punkt am Ende) gilt auch! Andernfalls kann der Benutzer keinen Zeitraum eingeben.

$('form').submit(function(e){ 
    if(! /^([0-9]+)((\.|,)([0-9]{1,2}))?$/.test($('#p_first').val())){ 
     $('#p_first').addClass('error'); 
     e.preventDefault(); 
    } 
}); 

Hinweis:

Und dann auf regex Scheck für gültig Gleitkommazahl ([0-9]{1,2}) statt ([0-9]{0,2}) einreichen Es ist besser $('#p_first') in den Variable zu setzen.var input = $('#p_first');

0

Ich habe die folgende Funktion verwendet, um zu überprüfen, ob eine gegebene Zeichenfolge Nummer ist oder nicht. Diese Implementierung funktioniert auf keyup und keydown und kümmert sich auch um Numpad Tasten

// Validate Numeric inputs 
function isNumber(o) { 
    return o == '' || !isNaN(o - 0); 
} 

Unter der Annahme, dass Ihr Schlüsselcode auf dem keyup oder keydown Ereignis ist in keyCode Variable:

var keyCode = e.keyCode || e.which; 
if (keyCode >= 96 && keyCode <= 105) { 
     // Numpad keys 
     keyCode -= 48; 
} 
console.log(isNumber(String.fromCharCode(keyCode))); 
console.log(isNumber($(this).val() + String.fromCharCode(keyCode))); 

Return false, wenn der Rückgabewert von ISNUMBER ist falsch:

var txtVal = $(this).val() + String.fromCharCode(keyCode); 
    if (!isNumber(txtVal)) { 
     e.returnValue = false; 
    } 
0

Mit einem Schlüsselereignis verwenden event.key den tatsächlichen Wert zu erhalten. wenn integer zu überprüfen:

isFinite(event.key); 

Eine einfache HTML Lösung wäre, den number Typen Eingang zu verwenden. Es beschränkt sich auf nur Zahlen (Art von).

<input type="number"> 

So oder so, sollten Sie alle Benutzereingaben mit reinigen:

string.replace(/[^0-9]/g,''); 
Verwandte Themen