How to disable input on type="number" but only keep spinners usable

Question

So I need to disable input on:

<input type="number" name="name" value="0" min="0" max="1" />

But keep the spinners working... to avoid some input anything above or beneath min and max.

possible duplicate of [Disable Text Entry in ](http://stackoverflow.com/questions/21215049/disable-text-entry-in-input-type-number) — James, Aug 12 '14 at 13:16
It's different because I need solution which disables input completely but leaves rollers working, so nobody can input anything but only use rollers for input... — Dino, Aug 12 '14 at 13:42
I really don't care for IE, all my web sites offer downloading Firefox or Chrome to capture full user experience. — Dino, Aug 12 '14 at 15:05

score 2 · Accepted Answer · answered Aug 12 '14 at 13:45

2

You can use jquery for this task:

HTML

<input type="number" name="name" value="0" min="0" max="1" />

JAVASCRIPT (JQUERY)

$('input[type="number"]').keydown(function(e) {
  e.preventDefault();
});

answered Aug 12 '14 at 13:45

ryeballar

Nice solution. You don't necessarily need JQuery though, if you give it an ID you can use the `onkeydown` event. EG: `document.getElementById("myNumericInput").onkeydown=function(e){e.preventDefault();}` – James Aug 12 '14 at 13:51
Not necessarily, how will you solve multiple input type numbers? You would have to create the event per `id`. You can use `document.querySelectorAll`, however that doesn't work on some browser versions. – ryeballar Aug 12 '14 at 13:55
Just give them all a class (most likely already will have a shared class) and iterate over `document.getElementsByClassName`? – James Aug 12 '14 at 14:05
As mentioned, such would not work on some browser versions, particularly IE – ryeballar Aug 12 '14 at 14:08
Oh right, particularly IE < 9 https://developer.mozilla.org/en-US/docs/Web/API/document.getElementsByClassName – James Aug 12 '14 at 14:16

1 Answers1