javascript防止复制/粘贴超出文本区域中的字符限制

Question

我有以下代码(从 this question 中提取)用于设置文本区域的字符限制。

function maxLength(el) {    
    if (!("maxLength" in el)) {
        var max = el.attributes.maxLength.value;
        el.onkeypress = function () {
            if (this.value.length >= max) return false;
        };
    }
}

var maxtext = document.getElementsByClassName("maxtext");

for (var i = 0; i < maxtext.length; i++) {
    maxLength(maxtext[i]);
}

还有我的文本区域 html 示例:

<textarea maxlength="150" class="maxtext"></textarea>

这一切在 Firefox 和 Chrome 中都运行得很好。在 IE7+ 中，如果我输入的内容达到限制，它会阻止我，但我可以不受限制地复制/粘贴文本。

有什么方法可以修改此脚本以防止复制/粘贴超出最大字符限制？

Answer 1

听onpaste事件。事件触发后，从 clipboard 获取文本并按照您喜欢的方式操纵它。

HTML

<textarea id="test" maxlength="10" class="maxtext"></textarea>

JAVASCRIPT

var test = document.getElementById("test");

test.onpaste = function(e){
    //do some IE browser checking for e
    var max = test.getAttribute("maxlength");
    e.clipboardData.getData('text/plain').slice(0, max);
};

EXAMPLE