25

ユーザー名テキスト フィールドのスペースを無効にしようとしていますが、私のコードでは戻る矢印の使用も無効になっています。戻る矢印も許可する方法はありますか?

    $(function() {
         var txt = $("input#UserName");
         var func = function() {
                      txt.val(txt.val().replace(/\s/g, ''));
                   }
         txt.keyup(func).blur(func);
    });

フィドル: http://jsfiddle.net/EJFbt/

4

4 に答える 4

68

ハンドラーを追加keydownして、スペース キー (つまり32)のデフォルト アクションを防止できます。

$("input#UserName").on({
  keydown: function(e) {
    if (e.which === 32)
      return false;
  },
  change: function() {
    this.value = this.value.replace(/\s/g, "");
  }
});

デモ: http://jsfiddle.net/EJFbt/1/

于 2013-01-09T14:02:16.110 に答える
5

キーを押すたびに、コードはすべてのテキストを完全に置き換え続け、そのたびにキャレットの位置が失われます。

それをしないでください。

押されたキーが次の場合に onkeydown ハンドラーから戻るfalsespaceなど、スペースを禁止するためのより良いメカニズムを使用します。

$(function() {
    $("input#Username").on("keydown", function (e) {
        return e.which !== 32;
    });​​​​​
});

このように、テキストボックスは最初からスペースを受け取ることが禁止されており、テキストを置き換える必要はありません。したがって、キャレットは影響を受けません。

アップデート

@VisioNの適応されたコードkeyupは、キャレットがまだアクティブなときにテキストボックスの値に影響を与えるtext-replacement-on- ハンドラーを回避しながら、このスペース禁止サポートをコピーアンドペースト操作に追加し

したがって、最終的なコードは次のとおりです。

$(function() {

    // "Ban" spaces in username field
    $("input#Username").on({

       // When a new character was typed in
       keydown: function(e) {

          // 32 - ASCII for Space;
          // `return false` cancels the keypress
          if (e.which === 32)
             return false;
       },

       // When spaces managed to "sneak in" via copy/paste
       change: function() {
          // Regex-remove all spaces in the final value
          this.value = this.value.replace(/\s/g, "");
       }

       // Notice: value replacement only in events
       //  that already involve the textbox losing
       //  losing focus, else caret position gets
       //  mangled.
    });​​​​​
});
于 2013-01-09T14:00:55.293 に答える
1

関数で適切なキー コードを確認してみてください。

$(function(){
    var txt = $("input#UserName");
    var func = function(e) {
      if(e.keyCode === 32){
        txt.val(txt.val().replace(/\s/g, ''));
      }
    }
    txt.keyup(func).blur(func);
});

そうすれば、keyCodeof 32(スペース) だけが replace 関数を呼び出します。これにより、他のkeypressイベントが通過できるようになります。IE での比較可能性に応じて、e存在するかどうかを確認するか、 を使用するかe.which、グローバルな window.event オブジェクトを使用する必要がある場合があります。ただし、そのようなトピックをカバーする多くの質問がここにあります。

よくわからない場合は、keyCodeこの役立つサイトを試してみてください。

于 2013-01-09T14:02:25.460 に答える