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

前端之家收集整理的这篇文章主要介绍了jquery – 如何阻止用户在达到最大字符数限制后在textarea中输入文本前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想阻止用户在达到最大字符数限制后在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) {

用户无法输入任何内容。我想要该光标从文本区域消失。但是如果用户删除一些文本,则光标也可供用户重新输入。我该怎么做?

解决方法

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

最好使用按键事件,并过滤不可打印的字符。

演示: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)

猜你在找的jQuery相关文章