如何防止用户在达到最大字符限制后在textarea中输入文本

Question

我想阻止用户在达到最大字符限制时在textarea中输入文本.发生了什么,当我达到最大限制然后我的文本区域滚动条移动到顶部我以某种方式阻止这个代码.

jQuery(document).ready(function($) {
    $('textarea.max').keyup(function() {
        var $textarea = $(this);
        var max = 400;
        if ($textarea.val().length > max) {
            var top = $textarea.scrollTop();
            $textarea.val($textarea.val().substr(0, max));
            $textarea.scrollTop(top);

        }
    });
}); //end if ready(fn)

但我也希望在达到最大限制后用户无法在textarea中输入任何内容.目前发生的情况是,如果用户按住键,达到最大限制后,字符在文本区域中键入,虽然在释放按钮后它返回到原始文本(即$ textarea.val($ textarea.val()). substr(0,max));).但是,一旦这种情况成为现实,我希望这样

if ($textarea.val().length > max) {

用户无法输入任何内容.我希望光标从textarea中消失.但是如果用户删除了一些文本,那么光标也可供用户再次输入输入.我该怎么做？

Answer 1

在keyup发生默认行为(填充文本区域)后,事件将触发.

最好使用该keypress事件,并过滤不可打印的字符.

演示:http://jsfiddle.net/3uhNP/1/(最大长度为4)

jQuery(document).ready(function($) {
    var max = 400;
    $('textarea.max').keypress(function(e) {
        if (e.which < 0x20) {
            // e.which < 0x20, then it's not a printable character
            // e.which === 0 - Not a character
            return;     // Do nothing
        }
        if (this.value.length == max) {
            e.preventDefault();
        } else if (this.value.length > max) {
            // Maximum exceeded
            this.value = this.value.substring(0, max);
        }
    });
}); //end if ready(fn)

Answer 2

<textarea maxlength="400"> </textarea>

使用上面的代码来限制插入文本区域的字符数,如果你想禁用textarea本身(即之后将无法编辑)你可以使用javascript/jquery来禁用它.