テキストボックスにカンマが3つ未満になるようにテキストボックスを制限するにはどうすればよいですか？

Question

たとえば、ブログのタグ用のテキストボックスがあります。私が望むのは、タグの数を制限することです。 たとえば、 "web hosting、php、windows8"と入力します。 ユーザーがコンマで始まるテキストボックスに別のテキストボックスを入力しようとすると、テキストボックスはそのテキストボックスに書き込めません。

Answer 1

keypressハンドラでは、eventオブジェクトをキャプチャしてください。

if (event.which == 44 && $(this).val().split(",").length > 2) { 
    event.preventDefault(); 
} 

ここでの動作を参照してください。 http://jsfiddle.net/5L7mU/

Answer 2

$(document).ready(function(){ 
    $('#textbox').keypress(function(e){ 
     var text = $(this).val(); 
     if(text.split(',').length>3){ 
      return false; 
     }else if(e.which==44&&text.split(',').length>2){ 
      return false 
     } 
    }); 
}); 

フィドル：

http://jsfiddle.net/L4X4C/

Answer 3

我々は3つの小さな問題にこの問題を分割することができます。

まず、ユーザーがテキストボックスに文章を書くのを止める方法が必要です。 keypressにコールバックをフックすると、渡されたイベントにはpreventDefaultというメソッドがあり、これを実行する必要があります。だから、すべての入力をブロックする：

今

$("input").keypress(function(event) { 
    event.preventDefault(); 
}); 

、テキストボックスに既に存在しているどのように多くの昏睡チェックするために、我々は正規表現を使用することができます。 match関数は、一致がない場合は空の配列の代わりにnullを返します。そのためにチェックする必要があります。

$("input").keypress(function(event) { 
    var matches = $(this).val().match(/,/g); 
    var count = 0; 
    if (matches) 
     count = matches.length; 
    console.log(count); 
}); 

最後に、ユーザーが昏睡状態になったかどうかを確認する必要があります。 eventオブジェクトには、入力された文字のキーコードを含むwhichというプロパティがあります。

$("input").keypress(function(event) { 
    var matches = $(this).val().match(/,/g); 
    var count = 0; 
    if (matches) 
     count = matches.length; 

    if (count >= 2 && event.which == 44) 
     event.preventDefault(); 
}); 

http://jsfiddle.net/4wn5W/