JQueryの検証文字の最小文字

Question

私は間違っていますが、基本的にこれは私が持っているものです。

はJQuery：

$(document).ready(function(){ 
$('form#status_form').submit(function(){ 
     var statusV = $('input#status_updated2').val(); 
     if(statusV.length > 255) 
     { 
     $('em#statusError').fadeIn().fadeOut(5000); 
     } 
     else 
     { 
     //do cool stuff 

     } 
    }); 
}); 

それから引っ張っだとHTMLフォーム：私はそれが必要とfnctionsのようなエラーメッセージが出てくるではないだろうやり方文字以上255という入力した場合

<em style="display:none;"id="statusError">*NO MORE THAN 255 CHARACTERS</em> 
<form id="status_form" name="status_form"> 
<input type="text" id="status_updated2" size="57" /> 
</form> 

"else"ステートメントに入ります。私は何が欠けていますか？

Answer 1

メッセージが表示されない理由は、エラーが発生してもデフォルトのアクション（フォーム送信）が発生しないようにしていないためです。あなたはそうのようにこれを停止することができます

$(document).ready(function(){ 
    $('form#status_form').submit(function(event){ 
     var statusV = $('input#status_updated2').val(); 
     if(statusV.length > 255) 
     { 
      event.preventDefault(); // stop the form submitting if there's an error. 
      $('em#statusError').fadeIn().fadeOut(5000); 
     } 
     else 
     { 
      //do cool stuff 
     } 
    }); 
}); 

は、実施例のためにjsfiddle hereを参照してください。

Answer 2

どのようにあまりにも多くの文字がすでに存在する場合falseをINGの​​イベントに結合し、returnについて：http://jsfiddle.net/5yRK2/

event.which != 8 && event.which != 46 - >これはバックスペースを可能にし、削除します。ここ

$('input[type="text"]').on('keydown', function (event) { 

    //check if the character limit has already been reached, but always allow backspace key strokes and delete key strokes 
    if (this.value.length >= 255 && event.which != 8 && event.which != 46) { 

     //this will stop the current key stroke from being added to the value of the input 
     return false; 
    } 
}); 

はデモですキーを使用して（文字を追加するのではなく文字を削除するため）

Answer 3

ほとんどの場合、デフォルトのフォーム送信イベントをキャプチャする必要があります。試してください：

$('form#status_form').submit(function(evt){ 
    evt.preventDefault();  
    ... 
} 

Answer 4

ロジックは問題ありません。しかし、e.preventDefault（）を呼び出して#status_formが送信されないようにすることを忘れてしまい、statusErrorメッセージが壊れてしまいます。

$('form#status_form').submit(function(e){ 
    ... 
    $('em#statusError').fadeIn().fadeOut(5000); 
    e.preventDefault();