ねこトトラ: NumericUpDownコントロール with JavaScript

2006年10月19日

Windowsの一般的なアプリケーションには、テキストボックスの右に数値を上下させるボタンのついたNumericUpDownコントロールが使われている。数値の上下はもちろん、数値でない文字列は受け付けないという優れたやつだ。が、HTML Formにはそれがない。

というわけで、懐かしのDOMで作ってみました。

ソース上ではただのテキストボックスですが、クラス名に "updown" と付けてこのスクリプトを噛ませるだけで、数値上下ボタンが出ます。

クラス名に "interval10" とすると10ずつ上下するようになり、 "max30" とすれば最大値が30 "min5" で最小値5になったりします。あと、数値以外を入力すると強制的に戻されます。

Mozilla Firefox1.5とInternet Explorer6では正常に動きました。Opera7.2では動きません。それ以外の環境ではテストしていませんが、動かなくてもべつに困らないので、深刻な問題にはならないでしょう。

困ったのが、IE6のname属性はsetAttributeできないというバグ。どうしてもイメージマップを生成できないので、泣く泣くouterHTML使いました。

むしろ・・・何で、初期値が１６なのか問いたい気分。

そして、下限が１０で、上限が２０についても。

投稿者トラねこ : 2006年10月24日 00:51

いや、そこは突っ込むところではｗ
深く考えない、考えない

投稿者無重力 : 2006年10月26日 22:07