Question

我想使用jquery来限制可编辑div（或表单输入）中的字符数。

Answer 1

在maxlength代码

中使用input

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

Answer 2

支持此功能的浏览器Maxlength属性 Javascript - 为其他人。

<input class="test-input" type="text" maxlength="12" />
<script>
$('.test-input').unbind('keyup change input paste').bind('keyup change input paste',function(e){
    var $this = $(this);
    var val = $this.val();
    var valLength = val.length;
    var maxCount = $this.attr('maxlength');
    if(valLength>maxCount){
        $this.val($this.val().substring(0,maxCount));
    }
}); 
</script>

http://jsfiddle.net/tvpRT/

Answer 3

我觉得这对你有用。

HTML

<input type="text" name="myText" id="myText" data-maxlength="10" />

的jQuery

$('#myText').keyup(validateMaxLength);

function validateMaxLength()
{
        var text = $(this).val();
        var maxlength = $(this).data('maxlength');

        if(maxlength > 0)  
        {
                $(this).val(text.substr(0, maxlength)); 
        }
}

Answer 4

如果你想使用JQuery，你可以自己写一些东西，或者只使用现有的插件，例如this one。

但我同意dku.rajkumar ...使用maxlength属性有什么问题？

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

如果你是最强大的JQuery粉丝永远，并且迫切希望立即为所有输入字段设置maxlength，请执行以下操作：

$(document).ready(function() {
   $('input[type="text"]').attr({ maxLength : 15 });
});

请记住，虽然这种方法（JQuery one）不适用于那些（无论出于何种原因）禁用JavaScript的人。虽然maxlength标记的input属性适用于所有浏览器中的所有人。

Answer 5

对于输入字段，您可以使用maxlength属性。如果您正在寻找div，请查看以下内容，

        $(function() {

            $ ('#editable_div').keydown ( function (e) {
                //list of functional/control keys that you want to allow always
                var keys = [8, 9, 16, 17, 18, 19, 20, 27, 33, 34, 35, 36, 37, 38, 39, 40, 45, 46, 144, 145];

                if( $.inArray(e.keyCode, keys) == -1) {
                    if (checkMaxLength (this.innerHTML, 15)) {
                        e.preventDefault();
                        e.stopPropagation();
                    }
                }
            });

            function checkMaxLength (text, max) {
                return (text.length >= max);
            }
        });

        <div id="editable_div" contentEditable="true" onclick="this.contentEditable='true';" >TEXT BEGIN:</div>

编辑：您应该重写checkMaxLength函数以忽略标签和换行符

Answer 6

让我们说它是表格输入你可以用'maxlength'属性来做，但如果你说'使用jQuery'，
这是解决方案。

$('input#limited').attr('maxlength', '3');

或者您可以检查每个按键

$('input#limited').keypress(function() {
     /*
     check for 3 or greater than 3 characters.
     If you check for only greater than 3, then it will let
     you write the fourth character because just before writing,
     it is not greater than three.
     */
     if($(this).val().length >= 3) {
        $(this).val($(this).val().slice(0, 3));
        return false;
    }
});

Answer 7

只使用名为“maxlength”的属性。您可以在w3 input

了解有关输入属性的更多信息

Answer 8

 $('#id').keypress(function(e) {
   var foo = $(this).val()
     if (foo.length >= 14) { //specify text limit
        return false;
        }
    return true;
 });

Answer 9

<input type="text" maxlength="20" id="alert_title"/>

$('#alert_title').unbind('keyup change input paste').bind('keyup change input paste',function(e){       
        var $this = $(this);

        var val = $this.val();
        var valLength = val.length;
        var maxCount = $this.attr('maxlength');
        if(typeof maxCount == "undefined"){
            $this.attr('maxlength',100);
        }
        if(valLength>maxCount){
            $this.val($this.val().substring(0,maxCount));
        }
    });

限制输入字段中的字符数

9 个答案: