html5.org](http://simon.html5.org/html-elements)'a göre, "number" giriş türü'nün "value niteliği, belirtilmişse ve boş değilse, geçerli bir kayan nokta sayısı olan bir değere sahip olmalıdır."
Yine de (en azından Chrome'un en son sürümünde), kayan sayılarla değil tam sayılarla bir "updown" kontrolüdür:
<input type="number" id="totalAmt"></input>
HTML5'e özgü bir kayan nokta giriş öğesi veya sayı giriş türünün ints yerine kayan noktalarla çalışmasını sağlamanın bir yolu var mı? Yoksa bir jQuery UI eklentisine mi başvurmalıyım?
Sayıtürü, hangi sayıların geçerli olduğunu kontrol eden bir
adımdeğerine sahiptir (
maksve
minile birlikte) ve varsayılan değer
1dir. Bu değer aynı zamanda adım düğmeleri için uygulamalar tarafından da kullanılır (yani yukarı basmak
step` kadar artar).
Bu değeri uygun olan değerle değiştirmeniz yeterlidir. Para için muhtemelen iki ondalık basamak beklenmektedir:
<input type="number" step="0.01">
(Sadece pozitif olabilecekse min=0
olarak da ayarlayabilirim)
İstediğiniz sayıda ondalık basamağa izin vermeyi tercih ederseniz, step="any"
kullanabilirsiniz (ancak para birimleri için 0,01
değerine bağlı kalmanızı tavsiye ederim). Chrome & Firefox'ta, any
kullanıldığında adım düğmeleri 1 artacak / azalacaktır. (Michal Stefanow'un cevabına any
yi işaret ettiği için teşekkürler ve ilgili spesifikasyona buradan bakın)
İşte çeşitli adımların çeşitli girdi türlerini nasıl etkilediğini gösteren bir oyun alanı:
<form>
<input type=number step=1 /> Step 1 (default)<br />
<input type=number step=0.01 /> Step 0.01<br />
<input type=number step=any /> Step any<br />
<input type=range step=20 /> Step 20<br />
<input type=datetime-local step=60 /> Step 60 (default)<br />
<input type=datetime-local step=1 /> Step 1<br />
<input type=datetime-local step=any /> Step any<br />
<input type=datetime-local step=0.001 /> Step 0.001<br />
<input type=datetime-local step=3600 /> Step 3600 (1 hour)<br />
<input type=datetime-local step=86400 /> Step 86400 (1 day)<br />
<input type=datetime-local step=70 /> Step 70 (1 min, 10 sec)<br />
</form>
Her zamanki gibi, kısa bir not ekleyeceğim: istemci tarafı doğrulamanın kullanıcı için sadece bir kolaylık olduğunu unutmayın. Sunucu tarafında da doğrulama yapmalısınız!
Via: http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/
Peki ya tüm sayıların, tam sayıların ve ondalık sayıların aynı şekilde geçerli olmasını istiyorsanız? Bu durumda, adımı "any" olarak ayarlayın
<input type="number" step="any" />
Chrome'da benim için çalışıyor, diğer tarayıcılarda test edilmedi.
Ben de aynı sorunu yaşadım ve Fransızca yerelleştirme nedeniyle sayıya nokta/tam nokta değil sadece virgül koyarak sorunu çözebildim.
Yani birlikte çalışıyor:
<input type="number" value="" />2 tamamdır
2,5 tamamdır
2,5 KO'dur (Sayı "yasadışı" olarak kabul edilir ve boş değer alırsınız).