[javascript]入力変換中の全角入力をキャンセル

現在keyイベントでfalseを返して試しているのですが、半角入力状態なら入力ができない状態になるのに、Enterで確定する前の入力変換中(全角入力の波線状態)の場合は文字が入力できてしまいます。
この、入力変換中の全角入力をキャンセルできる手段をご存知の方がいらっしゃいましたらご教授ください。

以下実験しているコードです。

$('#input_id').on('keydown', function (e) {

            var inputVal = $('#input_id').val();

            if (inputVal.length >= 15)
            {
                if ((e.which && e.which === 37) || (e.keyCode && e.keyCode === 37)) {
                    return true;
                }
                else if ((e.which && e.which === 39) || (e.keyCode && e.keyCode === 39)) {
                    return true;
                }
                else if ((e.which && e.which === 9) || (e.keyCode && e.keyCode === 9)) {
                    return true;
                }
                else if ((e.which && e.which === 8) || (e.keyCode && e.keyCode === 8)) {
                    return true;
                }
                else if ((e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)) {
                    return true;
                }
                else {
                    return false;
                }
            }
});

回答2件

ベストアンサー

javascript
1$(function(){
2  $("#input_id").keydown(function(event){
3    // 入力されたキーのコード
4    var keyCode = event.keyCode;
5
6    // falseを返却してキー入力処理をキャンセル
7    if(keyCode == 229){
8    	return false;
9    }
10  });
11});

全角入力させないってこういうことです？

投稿2016/07/14 06:02

YashaWedyue

総合スコア830

回答へのコメント

makiikeda1216

2016/07/14 06:19

回答ありがとうございます。現在想定している処理は、全角、半角両方ふくめて１５文字まで入力描画可能というものです。つまり、１０文字入力している状態で６文字目の入力変換中の全角文字が描画されたらアウトです。

YashaWedyue

2016/07/14 06:43

じゃあ単純にこんな感じでいいと思います。フォーカス外せば入力中の処理は中断されます。 if(length >= 15){ $(this).blur(); return false; }

makiikeda1216

2016/07/14 06:50

なるほど！希望通りの操作を実現することができました！ありがとうございます！

サポート機能としてはありだと思うけど、バリデートとして実装は難しいでしょう
（コピペされたデータとか判断分かれるので）
やるとするならhtml5のpattern属性を気休め程度につかうとか
あとはホワイトリスト以外の文字を削除するとかでしょうか。
(pattern属性はsafariとかスマホとか非対応なものもあると思います。)

いずれにしろサブミット後に再度バリデートは必要ですから

投稿2016/07/14 05:57