フォームに数字を入れてもらう場合、
数字を半角で管理したい、ということありますよね
入力制限などで、ユーザに半角を入力してもらうことも可能ではありますが
とてもめんどう。。
全角になっているというだけで、エラーが出てしまっては、離脱の原因にも
全角が入力されたとしても、システムで半角に直してあげるほうがユーザには優しいですよね
ということで、jsで全角文字を半角に直す方法です。
<input onkeyup="textChange(this)">
<script type="text/javascript">
var half = '0123456789';
var em = '０１２３４５６７８９';
function textChange(obj){
if(typeof(obj.value)!="string")return false;
var text = obj.value;
for( i=0; i<em.length; i++ ){
var regex = new RegExp(em[i],"gm");
text = text.replace(regex,half[i]);
}
obj.value = text;
}
</script>
処理の流れは以下のようなかんじです。
2つの配列に、対応するように全角と半角を入れます。
入力された文字が、全角の配列の文字と一致するか比べます。
一致したら、半角の配列の中の、対応した数値と置換します。
RegExpはマッチングをみる際に正規表現にする指定です。
gmは、以下の項目を元に指定されています。
| オプション | 説明 |
|---|---|
| g | 全文検索を行う |
| i | 大文字、小文字の区別無くマッチする |
| m | 複数行のマッチに対応する |
replaceは文字置換です。
replace(置換前, 置換後);
のように使います。
アルファベットでも同じことがしたい、という場合、
配列にアルファベットも追加してあげればできます
