javascriptでひらがなをカタカナに変更する

DSC00750

2014年05月11日(日)

これは必要だと思うよ!これって日本人は結構使うよね?javascriptでひらがなをカタカナに変更するのって結構日本人向けのサイトの入力フォームがあるサイトであればユーザビリティを上げるためには必須機能だと思う。

 

ということで実際にやってみて汎用的に使えるようになっているので全部を読み込むjsファイルに記述してあげてくださいね。

 

プロトタイプに追加

以下をjsファイルに定義しておきます。

String.prototype.toKatakanaCase = function()
{
 var i, c, a = [];
 for(i=this.length-1;0<=i;i--)
 {
 c = this.charCodeAt(i);
 a[i] = (0x3041 <= c && c <= 0x3096) ? c + 0x0060 : c;
 };
 return String.fromCharCode.apply(null, a);
};

 

実際に使う場合は以下のようにして使おう

こんな感じかな。

"ぁぃぅぇぉあいうえお".toKatakanaCase(); // ァィゥェォアイウエオ

 

 

簡単だよね。これをやっておけばユーザビリティを高めることは確実や!

 

あと、このままだとどのタイミングでハンドリングするのか分かりにくい方もいるかな?

Formで使うような場合は以下のようになるかな。

 

// HTML
<input type="text" id="katakana" name="kana">

 

// jQueryでやった場合 ※jQueryを読み込んでね
$("#katakana").on("change", function(){
    $(this).val( $(this).val.toKatakanaCase() );
})

 

こんな感じでイベントをハンドリングして実行してあげればフロントサイドのみで組み込めるで。

ぜひいろいろなパターンで試してください。

 

スポンサードリンク

運営サービスPR

スポンサードリンク

運営サービスPR