Question

什么是跨浏览器方式，使用普通Javascript设置textarea中的最大字符数？ maxlength不适用于Opera和IE9及更低版本的textareas（尽管它适用于所有主流浏览器的输入）。

达到字符限制后，textarea不应允许输入更多字符。使用Ctrl + V或右键单击上下文菜单粘贴的文本应在字符限制处被截断。这意味着仅使用onkey___事件的解决方案是不够的。

Answer 1

生成函数，它将截断值或阻止条件下的事件，然后将它们作为几个不同的侦听器添加到所有人你感兴趣的事件。

function snip(len) {
    return function (e) {e.target.value = e.target.value.slice(0, len);};
}
function prevent(len) {
    return function () {
        if (e.target.value.length >= len) {
            e.preventDefault();
            return false;
        }
    };
}

var len = 5; // choose your length however you want

var textarea = document.getElementById('texta'), // get the node
    trunc = snip(len),
    prev1 = prevent(len),
    prev2 = prevent(len - 1);

textarea.addEventListener('change'  , trunc, true);
textarea.addEventListener('input'   , trunc, true);
textarea.addEventListener('keydown' , prev2, true);
textarea.addEventListener('keypress', prev2, true);
textarea.addEventListener('keyup'   , prev1, true);
textarea.addEventListener('paste'   , trunc, true);

可能需要在IE中以不同方式附加事件

DEMO

<textarea>字符限制</textarea>

1 个答案: