

monacaでAndroid向けのアプリを開発しています。  
画面のテキストフィールドの入力を半角英数に限定したいですが、正常に動きません。  
試しに、inputタグにtype="url"、type="email"を指定してみたのですが、半角英数にはならないです。  
どなたかいい方法をご存じでしたら教えてください。


CC BY-SA 3.0
2016-04-11T09:23:53.010
23912
2016-04-12T02:21:40.033
14347
question
monaca
monacaでテキストフィールドの入力を半角英数にする方法


入力値の制限は難しい問題です。

`input`に`type="url"` `type="email"`を付与しているようですが、  
Androidでは、これらはすべて`type="text"`と同義です。

ほかには`pattern属性`というものもあるのですが、  
これは正規表現で入力値を制限しようというものです。  
ですが、この属性は入力値を必ず保障するものではありません。  
(※入れないよりはマシなので、入れてもいいとは思います)

ですので入力後の文字列をこちらでチェックするのが一番確実かと思います。

[code]

    /**
     * inputをチェックし半角英数に制限する
     * @param ele Element
     **/
    function check_val(ele){
     //オリジナル文字列
     var orig = ele.value;
     //1文字ずつ配列にする
     var strs = orig.split('');
     //チェック後の文字列
     var checks = '';
     //1文字ずつチェックし、escapeに反応しなかったら追加
     for (var n=0,len=strs.length; n<len; n++) {
      var work = escape(strs[n]);
      if (1 == work.length) { checks+=work; }
     }
        
     //結果を入力に再代入
     ele.value = checks;
    }
[/code]

[code]

    <input type="url" pattern="^[0-9A-Za-z]+$" value="" onchange="check_val(this);" />
[/code]

サンプルでは全角は削除対応しておりますが、  
上記を改修して全角英数は半角に直すことも可能です。  
色々試行錯誤してみてください。


CC BY-SA 3.0
2016-04-12T02:21:40.033
23933
2016-04-12T02:21:40.033
23912
answer