ご挨拶
Qiita初投稿です。普段Facebookにいろいろ書くことが多いですが、そちらでは技術系の投稿に反応がまったくないのでQiitaを始めてみることにしました。半分メモ代わりです。
さて、今回は、最近仕事でエントリーフォームを作っていて気がついたフロントエンドのTipsネタです。
全角カタカナ正規表現
HTML5でFormの入力エラーチェック（バリデーション）に使うpattern属性はなかなか便利ですが、2016年現在「正規表現 カタカナ」といったキーワードでググると、下記のように書くべしという情報が多く出てきます。
<input type="text" id="name_kana" required pattern="[\u30A1-\u30F6]*"/>
確かに大半の日本人の名前だけを考えるならばこれでいいのですが、この書き方だと長音符「ー」が含まれないので、長音符が入る外国人の名前などのバリデーションに不都合が生じます。
「リリー・フランキー」アウト！「所ジョージ」もアウト！
全角カタカナ正規表現に長音符を含める方法
これではいけないので、pattern部分を以下のように書き換えます。
<input type="text" id="name_kana" required pattern="[\u30A1-\u30FC]*"/>
こうすれば、長音符が含まれるようになるので、無事にバリデーション出来るようになりました。
余談
なお日本語のために割り当てられた Unicode 一覧はこちら。
見たことない文字がいっぱいあります。「ヿ」はなんと読むのでしょうか...。