Membuat input type text hanya boleh berisi angka dengan HTML5

Bagaimana membuat input text supaya hanya boleh berisi angka saja? Tidak perlu menggunakan javascript, karena dengan menggunakan HTML5 kita bisa membuatnya dengan mudah.

Anggap saja kita ingin membuat kolom untuk menginputkan temperatur badan seseorang dengan aturan suhu yang boleh diinputkan minimal 30^o dan maksimal 50^o, ditambah lagi dimungkinkan untuk memasukkan sebanyak satu angka decimal.
Contohnya: 30.1^o.

Baca Juga: Memeriksa Password Strength dengan pStrength jQuery Plugin

Dengan kebutuhan seperti itu, kita bisa membuatnya menggunakan HTML5 dengan kode sebagai berikut:

<input id="temperature" class="form-control" max="50" maxlength="4" min="30" name="temperature" size="50" step="0.1" type="number" />

type="number" digunakan sebagai indikator bahwa input data hanya boleh angka.
step="0.1" artinya kenaikan atau pengurangan angka jika tanda up/down diklik.
min="30" max="50" adalah angka minimal dan maksimal yang boleh diinputkan supaya form bisa disubmit.

Dan hasil jadi dari contoh di atas adalah:

DEMO

Baca Juga: Memeriksa Password Strength dengan pStrength jQuery Plugin

Selamat mencoba.