テキストボックスを分けずに、入力パターンを制御してくれるjQueryプラグインformatter.jsを使ってみた。

生年月日や電話番号など、テキストボックスを分けずに1つでも意図した値を得ることができそうと思ったのがきっかけ。

 

まずはこちらからソースをダウンロード

https://github.com/firstopinion/formatter.js

ファイルがいろいろ入っているが、jQueryとformatter.jsを読みこめば良い。

あとは入力フォームを用意して(maxlengthは設定したほうが良い)

JSを実行する。

 

パターンは{{}}で囲う必要があり、それぞれ以下のように指定する。

数字(0-99) → 9

英字(A-Za-z) → a

全て(A-Za-z0-9) → *

 

デモはこちら

demo

 

しかし、使ってみてわかったが、2つ大きな欠点がある。

 

1. 日本語が使えない

姓名の間にスペースを入れるなどのフォーマットはできない。

それは良いとしても、記号や空白文字列も使えないので、結構困る。

正規表現が使えれば良いのだが、対応してないみたい。

 

2. 桁数がフレキシブルじゃない

例えば日本の電話番号だと

03-…の場合もあれば080…の場合もある。

しかしこちらのプラグインでは桁数は予め決めた桁数からの過不足は認められない。

なので使うのであれば完全に桁数が決まっていなければならない。

 

用途は限られるが、特にシリアルなどはわかりやすいので使ってみようと思う。