Предел символов в текстовом поле

<input id="post" type="text" style="width:400px;"/>

Знаете, когда вы идете на сайт, начинаете вводить текстовое поле, и вдруг ваша клавиатура перестает печатать, потому что вы достигли лимита символов?

Как я могу сделать это для этого текстового поля для 140 символов?

Ответ 1

Используйте атрибут maxlength.

<input id="post" type="text" style="width:400px;" maxlength="140" />

Ответ 2

Использование плагина jQuery Limit: http://jsfiddle.net/AqPQT/ (демо)

<script src="http://jquery-limit.googlecode.com/files/jquery.limit-1.2.source.js"></script> 
<textarea ></textarea>
<span id="left" />

$('textarea').limit('140','#left');

см. также: http://unwrongest.com/projects/limit/

Если вы ищете решение sans-jquery, просто используйте атрибут maxlength.

<input type="text" maxlength="140" />

Ответ 3

Попробуйте этот фрагмент кода.

var limitCount;
function limitText(limitField, limitNum)
 {
   if (limitField.value.length > limitNum)
    {
     limitField.value = limitField.value.substring(0, limitNum);
    }
    else
    {
     if (limitField == '')
     {
       limitCount = limitNum - 0;
     }
     else
     {
       limitCount = limitNum - limitField.value.length;
     }
    }
   if (limitCount == 0)
     {
      document.getElementById("comment").style.borderColor = "red";
       }
   else
     {
       document.getElementById("comment").style.borderColor = "";
       }
 }

<input type="text" id="comment" name="comment" onkeyup="limitText(this,20);" onkeypress="limitText(this,20);" onkeydown="limitText(this,20);" />

Ответ 4

function limitChars(textid, limit, infodiv) {
    var text = $('#'+textid).val(); 
    var textlength = text.length;
    if(textlength > limit) {
        $('#' + infodiv).html('You cannot write more then '+limit+' characters!');
        $('#'+textid).val(text.substr(0,limit));
        return false;
    }
    else {
        $('#' + infodiv).html('You have '+ (limit - textlength) +' characters left.');
        return true;
    }
}

// Bind the function to ready event of document. 
$(function(){
    $('#comment').keyup(function(){
        limitChars('comment', 140, 'charlimitinfo');
    })
});