タブ記事をリーディングリストに入れ終わった、input[type="number"]を安易に使わない

ここ数日睡眠不足なのかパフォーマンスが著しく悪い。今日はこれ書いたらすぐ寝るぞ……。

タブの記事をリーディングリストに入れ終わった

何百のタブを消したかわからないけどひとまず不要なやつを消して真に「あとで読みたい」リンクだけをリーディングリストに突っ込み続けてようやく終わった。ブラウザがかなりすっきりしていて本当に良い。

ブラウザのタブってこんなに見やすかったのかというのを久々に体感しました。

リーディングリスト消化

増減する数値にのみ利用すべきであり、クレジットカードの番号のようなものには使わない。なるほど。

値を表現するための型が number だからといってすべて number で表現してはいけない、ということか。まあクレジットカードの番号とかは DB に保存するときに大体 String のはずだし、それを UI 上でも同様に認識すべきということかな。

上下の矢印がついている数値入力の UI を利用する必要がある値かをよく確認しよう。

指数表記(e+26 とか)になると上下の矢印は使えないらしい。まあそういう値を入力してもらう機会はかなり少ないと思うけど。

そして指数表記ができるからeも入力できるらしい。マジか。

矢印の上下で先頭の 0 が消えるというのもあるので、改めてクレジットカード番号のような値には使わないように気をつける。

この記事の「現時点での最適解」として、以下のようにするのがいいらしい。

<input type="text" inputmode="numeric" pattern="\d*" />

inputmode="numeric"を指定すると、スマートフォンで入力するときに数値入力のキーボードが出る。なるほど。

inputmode に非対応の OS のバージョンでも、pattern 属性を指定するとでるらしい。勉強になった。