1

我有以下代码：

$(document).ready(function (e) {

    $('#input').keydown(function (e)
    {
        var inpData_lenght = $(this).val().length+1;
        var max_length     = 15;
        if (inpData_lenght >= max_length)
        {
            if (inpData_lenght > max_length)
            {
                if ((e.keyCode != 8) && (e.keyCode != 46))
                {
                    e.stopImmediatePropagation();
                    e.preventDefault();
                }
            }

            $(this).css({'background-color': '#ff8080'});
        }
        else
        {
            $(this).css('background-color', '');
        }  
    });
});

HTML：

<textarea id="input"></textarea>

（小提琴）

当有字符时 textarea 不会将背景更改回白色，max_length-1但只有 on max_length-3，有什么解决方法吗？我知道这与算作字符的退格或删除有关。

编辑：我只能使用 keydown 因为这是插件支持的唯一与键相关的回调。

4

5 回答 5

3

最好使用keyup()而不是keydown()因为您将获得结果输入值。如果长度超过最大值，只需将输入值替换为前一个值。http://jsfiddle.net/9Ed8h/

$(document).ready(function (e) {

    $('#input').keyup(function (e)
    {
        var inpData_lenght = $(this).val().length;
        var max_length     = 15;
        if (inpData_lenght >= max_length)
        {
            if (inpData_lenght > max_length)
            {
                $(this).val(this.lastValue);
            }

            $(this).css({'background-color': '#ff8080'});
        }
        else
        {
            $(this).css('background-color', '');
        }  
        this.lastValue = $(this).val();
    });
});
于 2013-07-09T11:07:40.457 回答
0

使用 keyup 将解决您的问题。你应该想办法防止人们按住他们的钥匙。（如果你按住一个键 2 秒，你的 15 个字符的限制将被超过）

如何在jQuery中禁用重复的keydown

于 2013-07-09T11:13:48.823 回答
0

如果您需要解决方法keydown，以下应该可以工作：

var maxLength = 15;
var currLength = this.value.length;
if (e.keyCode == 8 || e.keyCode == 46) {
    var expectedLength = currLength - 1; // distinguish here!
} else {
    var expectedLength = currLength + 1;
    if (expectedLength > maxLength) {
         e.stopImmediatePropagation();
         e.preventDefault();
    }
}
if (expectedLength >= maxLength)  {
    $(this).css('background-color', '#ff8080');
} else {
    $(this).css('background-color', '');
}
于 2013-07-09T12:08:19.870 回答
0

结合 maxlength 和 keyup 应该是最简单的方法。

<textarea id="input" maxlength=3></textarea>

和

$(document).ready(function (e) {

    $('#input').keyup(function (e)
    {
        var inpData_lenght = $(this).val().length;
        var max_length     = 3;
        if (inpData_lenght >= max_length)
        {
            $(this).css({'background-color': '#ff8080'});
        }
        else
        {
            $(this).css('background-color', '');
        }  
    });
});

见小提琴：http: //jsfiddle.net/DEjgd/4/

于 2013-07-09T11:29:27.343 回答
-1

您可以使用类似这样的东西，而不是使用 javascript 条件

<textarea maxlength="15" id="input"/>
于 2013-07-09T11:10:21.367 回答