Ich habe gesehen, dass einige Browser die input type="number"
-Notation von Zahlen lokalisieren.
In Bereichen, in denen in meiner Anwendung Längen- und Breitengradkoordinaten angezeigt werden, bekomme ich beispielsweise "51,983", wo es "51,982559" sein sollte. Meine Problemumgehung ist die Verwendung von input type="text"
, aber ich möchte die Zahleneingabe mit korrekter Anzeige der Dezimalzahlen verwenden.
Gibt es eine Möglichkeit für force Browser, einen Dezimalpunkt in der Zahleneingabe zu verwenden, unabhängig von den lokalen Einstellungen des Clients?
(Es versteht sich von selbst, dass ich dies in meiner Anwendung sowieso auf der Serverseite korrigiere, aber in meinem Setup muss es auch auf der Clientseite korrekt sein (aufgrund von JavaScript)).
Danke im Voraus.
UPDATE Beim Abrufen von Chrome Version 28.0.1500.71m unter Windows 7 akzeptiert die Zahleneingabe momentan keine mit Komma formatierten Dezimalstellen. Vorgeschlagene Vorschläge mit dem step
attribute scheinen nicht zu funktionieren.
Wenn das Attributstepauf die Genauigkeit der gewünschten Dezimalstellen festgelegt ist, akzeptiert die numerische Eingabe von html5 Dezimalzahlen. z.B. Werte wie 10.56 annehmen; Ich meine 2 Dezimalstellen, mach das:
<input type="number" step="0.01" min="0" lang="en" value="1.99">
Sie können das Attributmaxfür den maximal zulässigen Wert angeben.
Edit Fügen Sie dem Eingabeelement einlang- Attribut mit einem Gebietsschemawert hinzu, der Dezimalstellen mit Punkt anstelle von Komma formatiert
Derzeit berücksichtigt Firefox die Sprache des HTML-Elements, in dem sich die Eingabe befindet. Versuchen Sie beispielsweise diese Geige in Firefox:
http://jsfiddle.net/ashraf_sabry_m/yzzhop75/1/
Sie werden sehen, dass die Zahlen arabisch sind und das Komma als Dezimaltrennzeichen verwendet wird, wie es bei Arabisch der Fall ist. Dies liegt daran, dass das Tag BODY
das Attribut lang="ar-EG"
erhält.
Versuchen Sie es als nächstes:
http://jsfiddle.net/ashraf_sabry_m/yzzhop75/2/
Diese wird mit einem Punkt als Dezimaltrennzeichen angezeigt, da die Eingabe in eine DIV
eingeschlossen wird, die das Attribut lang="en-US"
enthält.
Eine Lösung, auf die Sie zurückgreifen können, besteht darin, Ihre numerischen Eingaben mit einem Containerelement zu umschließen, das so eingestellt ist, dass eine Kultur verwendet wird, die Punkte als Dezimaltrennzeichen verwendet.
Entsprechend dem spec können Sie any
als Wert des step
-Attributs verwenden:
<input type="number" step="any">
Leider ist die Reichweite dieses Eingabefeldes in den modernen Browsern sehr gering:
http://caniuse.com/#feat=input-number
Daher empfehle ich, den Fallback zu erwarten und sich auf eine schwer programmierte Eingabe [type = text] zu verlassen, um den Job auszuführen, bis das Feld allgemein akzeptiert wird.
Bisher haben nur Chrome, Safari und Opera eine ordentliche Implementierung, aber alle anderen Browser sind fehlerhaft. Einige von ihnen scheinen keine Dezimalzahlen zu unterstützen (wie BB10)!
1) 51.983 ist eine Zeichenfolgentypnummer, die kein Komma akzeptiert
sie sollten es also als Text festlegen
<input type="text" name="commanumber" id="commanumber" value="1,99" step='0.01' min='0' />
ersetzen mit .
und ändern Sie das Typattribut in number
$(document).ready(function() {
var s = $('#commanumber').val().replace(/\,/g, '.');
$('#commanumber').attr('type','number');
$('#commanumber').val(s);
});
Check out http://jsfiddle.net/ydf3kxgu/
Hoffe, das löst dein Problem
Ich habe einen Blogartikel gefunden, der etwas zu erklären scheint: http://blog.isotoma.com/2012/03/html5-input-typennummer-and-decimalsfloats-in-chrome/
In Summe:
step
hilft bei der Definition der Domäne der gültigen Wertestep
ist 1
min
und max
, falls angegeben)Ich würde davon ausgehen, dass dies mit der Mehrdeutigkeit der Verwendung eines Kommas als Tausendertrennzeichen im Vergleich zu einem Komma als Dezimalpunkt zusammenfällt, und Ihr 51,983
ist tatsächlich ein merkwürdig geparstes einundfünfzig, eintausend, neunhundert und acht drei.
Anscheinend können Sie step="any"
verwenden, um die Domäne auf alle rationalen Zahlen im Bereich zu erweitern, jedoch habe ich es selbst nicht versucht. Für Längen- und Breitengrad habe ich erfolgreich verwendet:
<input name="lat" type="number" min="-90.000000" max="90.000000" step="0.000001">
<input name="lon" type="number" min="-180.000000" max="180.000000" step="0.000001">
Es ist vielleicht nicht schön, aber es funktioniert.
Edit: Der aktualisierte Link lautet https://www.isotoma.com/blog/2012/03/02/html5-input-typenumber-and-decimalsfloats-in-chrome/
Ich weiß nicht, ob dies hilft, aber ich stolperte hier, als ich nach demselben Problem suchte, nur aus einer EingabeSicht (dh ich habe festgestellt, dass mein <input type="number" />
beim Eingeben des Wertes ein Komma und einen Punkt akzeptierte.) aber nur das letztere war an das anglejs-Modell gebunden, das ich der Eingabe zugewiesen hatte, so dass ich es gelöst habe:
.directive("replaceComma", function() {
return {
restrict: "A",
link: function(scope, element) {
element.on("keydown", function(e) {
if(e.keyCode === 188) {
this.value += ".";
e.preventDefault();
}
});
}
};
});
Dann, in meiner HTML-Datei, einfach: <input type="number" ng-model="foo" replace-comma />
ersetzt Kommas schnell durch Punkte, um Benutzer daran zu hindern, ungültige (aus einem Javascript-Standpunkt, nicht lokalisierte) Zahlen einzugeben. Prost.
Verwenden Sie lang attribut für die Eingabe. Gebietsschema in meiner Web-App fr_FR, lang = "en_EN" in der Eingabezahl und ich kann ein Komma oder einen Punkt gleichgültig verwenden. Firefox zeigt immer einen Punkt an, Chrome ein Komma. Aber beide separtor sind gültig.
Haben Sie darüber nachgedacht, Javascript zu verwenden?
$('input').val($('input').val().replace(',', '.'));
eine Option ist javascript parseFloat()
... parse niemals einen "text chain" --> 12.3456
mit Punkt auf einen int ... 123456
(int entferne den Punkt) eine Textkette in ein FLOAT ...
um diese Koordinaten an einen Server zu senden, senden Sie eine Textkette. HTTP
sendet nur TEXT
im Client sollten Sie die Eingabekoordinaten nicht mit "int
" analysieren und mit Textzeichenfolgen arbeiten
wenn Sie die Kabel in der HTML-Datei mit PHP oder ähnlichem drucken, schweben Sie in Text und drucken Sie in HTML
Soweit ich es verstehe, gibt der HTML5 input type="number
immer input.value
als string
zurück.
Anscheinend gibt input.valueAsNumber
den aktuellen Wert als Fließkommazahl zurück. Sie können dies verwenden, um einen gewünschten Wert zurückzugeben.