HTML5'te kayan giriş türü var mı?

Html5.org'a göre , "sayı" girdi türünün "değer özniteliği, belirtilir ve boş değilse, geçerli bir kayan nokta sayısı olan bir değere sahip olmalıdır."

Yine de (sadece Chrome'un en son sürümünde), tamsayılarla bir "yukarı yönlü" kontrol, kayan değil:

<input type="number" id="totalAmt"></input>

HTML5'e özgü bir kayan nokta giriş öğesi mi yoksa sayı giriş türünün ints ile değil de floatlarla çalışmasını sağlamanın bir yolu var mı? Yoksa bir jQuery UI eklentisine başvurmalı mıyım?

numberTipi vardır step(birlikte geçerli olan sayılar kontrol değeri maxve min), varsayılan 1. Bu değer ayrıca adım düğmelerinin uygulamaları için de kullanılır (yani yukarı basma artar step).

Bu değeri uygun olanla değiştirmeniz yeterlidir. Para için muhtemelen iki ondalık basamak bekleniyor:

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

(Ben min=0sadece olumlu olabilir eğer de ayarlayacağım )

Herhangi bir sayıda ondalık basamağa izin vermeyi tercih ederseniz, kullanabilirsiniz step="any"(para birimleri için yapışmasını tavsiye ederim 0.01). Chrome ve Firefox'ta, adım düğmeleri kullanırken kullanırken 1 artar / azalır any. (Michal Stefanow'un dikkat çektiği yanıtı anyve ilgili spesifikasyona buradan bakın )

Ç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 hızlı bir not ekleyeceğim: istemci tarafı doğrulamanın sadece kullanıcı için kolaylık olduğunu unutmayın. Ayrıca 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, tamsayıların ve ondalık sayıların aynı olmasını isterseniz? Bu durumda, adımı “herhangi biri” olarak ayarlayın

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

Chrome'da benim için çalışıyor, diğer tarayıcılarda test edilmedi.

Kullanabilirsiniz:

<input type="number" step="any" min="0" max="100" value="22.33">

Giriş türü numarasına step özelliğini kullanabilirsiniz:

<input type="number" id="totalAmt" step="0.1"></input>

step="any"herhangi bir ondalık sayıya izin verir.
step="1"ondalık sayıya izin vermeyecektir.
step="0.5"0.5'e izin verecek; 1 'dir; 1.5; ...
step="0.1"0.1'e izin verecek; 0,2; 0.3; 0.4; ...

Bu cevaba dayanarak

<input type="text" id="sno" placeholder="Only float with dot !"   
   onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||  
   event.charCode == 46 || event.charCode == 0 ">

Anlamı:

Karakter kodu:

• 48-57 eşittir 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
• 0 Backspace(aksi takdirde Firefox'ta sayfayı yenilemeniz gerekir)
• 46 dot

&&olduğunu AND, ||bir ORoperatör.

virgülle yüzmeyi denerseniz:

<input type="text" id="sno" placeholder="Only float with comma !"   
     onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||  
     event.charCode == 44 || event.charCode == 0 ">

Desteklenen Chromium ve Firefox (Linux X64) (mevcut olmayan diğer tarayıcılar.)

Ben yaparım

 <input id="relacionac" name="relacionac" type="number" min="0.4" max="0.7" placeholder="0,40-0,70" class="form-control input-md" step="0.01">

daha sonra, adım 0.01: 0.4, 0.41, 0,42 ... 0.7 ile min'de 0.4 ve maks. 0.7'de tanımlarım

Ben sadece aynı sorunu vardı, ve ben Fransız virüsü nedeniyle sayı bir nokta / nokta değil tam bir virgül koyarak düzeltebilir .

Yani şu şekilde çalışır:

2 tamam

2,5 iyi

2.5 KO (sayı "yasadışı" olarak kabul edilir ve boş değer alırsınız).