input[type=number] の有用性

html5 で input タグの type 属性がかなり増えましたが、なんだかあまり使われていない印象です。
ここでは type の種類（特に number）に着目しつつ、その有用性を説きたいと思います。

有用性1（UI の使い勝手が向上する）

もう言うまでもないメリットです。type=number に対応しているブラウザであれば

スピンボタンが登場する
上下キーで値が上下する
min, max, step 属性で値をある程度制限することができる

type には tel とか search とか email とか色々ありますが、ブラウザがあんまり対応していなかったり、目を見張るメリットがなかったり、入力項目として頻出しない、などであまり目立たない印象です。（ただ、入力値を明示する意味で積極的に使うべきだと思います。まぁスマホでは重要ですが）。

その点 type=number は「数値入力」というありふれた項目である上、スピンボタンがありがたすぎます。

有用性2（互換性を意識する必要がない）

html においては

なんだかよく分からない type は type=text として扱う
なんだかよく分からない type でも未対応の場合は type=text として扱う

と定義されています。
従って、何も考えず type=number としておけば、未対応ブラウザは type=text として、対応ブラウザは type=number として扱われます。

これにより、数値しか期待されていない入力項目で type=text を使うメリットは何一つ無い、と言えます。
（既存システムを書き換えるとセレクタの関係で問題が発生しそうですが）。

有用性3（変なクラスを当てる必要がない）

type=number は数値の入力を想定しています。
そしての数値の入力は右寄せになっていて欲しいです（個人的には、ですが）。

type=text の場合は下記のような html を記述する必要があります（style タグは css ファイルに書かれていると思ってください）。

<style>
    input.tr {text-align: right;}
</style>

<input type="text" class="tr" /><br />

text フィールドに class で「右寄せにしてね」と指示しています。
これはこれで有りだと思いますが、「数値は一律右寄せ」という仕様であれば

    input[type=number] {text-align: right;}

と書いたほうが class の当て忘れもなくスマートです。

また、ホイールで値の上限したい場合なども同様です。
それ用の class の当てるのではなく、 input[type=number] で全て解決します。

有用性4（専用の各種メソッドが使える）

type=number として記述した input 要素は

stepUp
stepDown

というメソッドを呼ぶことが出来ます。
これは min, max, step 属性から、適切な値になるように値の増減をしてくれるメソッドです。

このメソッドを駆使するとプラグインの製作がとても捗ります。

ちょっと試してみると分かりますが、min, max, step 属性には小数も使えるため、自前で stepXX 系のメソッドを作ろうとすると結構苦労します。

こちらの記事でも触れていますが、特別なことをしない限り、min + step * N でバリデーションが走るので、よしなに実装すると「入力値が不正です」とかで怒られたりします。

個人的なプラグインで「スピンボタンを一定時間押し続けると増減値が10倍、100倍になる」「マウスホイールのグリグリで値が増減できる」という物を作りましたが、上記のメソッドがないと結構めんどくさかったと思います。