全角カナを半角カナに変換するJavaScriptツール(逆も可能)

全角カナを半角カナに変換するJavaScriptツール(逆も可能)

全角カナを半角カナに変換する

フィーチャーフォン(ガラケー)向けのサイトを作成する際は全角カナは半角カナに変換する必要がある。

サイトによっては全角カナで入力されたHTMLを自動でサーバー側で半角カナに変換しているところも存在するが、そうでない場合は手入力が必要だ。

テキストが全角カナで用意されている場合は入力者が半角カナに変換して入力する必要があるのだがWebサイト上には使いやすい全角カナ・半角カナ変換ツールがなかったため自作してみた。

変換する文字を決める

変換する文字は「ア」から「ン」までの全角カタカナ以外にも全角記号も変換する必要がある。記号に関しては「。 、 ー 「 」 ・ ゛ ゜」の句点や濁点なども含めた8種類を範囲に含めた。

!?などの感嘆符や疑問符はHTMLのソースコードで使用されるため含めていない。

変換するカナ・記号のオブジェクト

入力した瞬間すぐのタイミングで変換したいためinputイベントを使用。半角カナから全角カナにも変換できるよう以下コードを参考にして半角カナ全角カナのオブジェクトを反転できるようにした。

Objectのkeyとvalueを反転させる。もしくはJSでenum的なものを作る。

当然変換したものはコピーして使用するためコピーボタンを配置。

できあがったものがこちらになります。

全角カナを半角カナに変換するJavaScriptツール(逆も可能)