textarea绑定keypress事件后输入字符无法显示的问题求助

你写的maxLengthKey函数开头直接设置event.returnValue = false，这会直接拦截textarea的默认输入行为——哪怕后面在else分支把它改回true，也已经晚了，输入的字符自然不会显示出来。另外这个写法依赖全局的event对象，在不同浏览器环境里可能出问题，而且returnValue是比较老旧的API。

修正事件处理函数 #

调整逻辑，只在字符超限时阻止默认输入行为，同时把事件对象作为参数传入，避免全局依赖：

function maxLengthKey(event, field, maxChars) {
  if (field.value.length >= maxChars) {
    alert("字符数量超出限制。");
    event.preventDefault();
    return false;
  }
  return true;
}

修正HTML调用 #

调用时把event对象传入函数：

<textarea name="textArea1" rows="2" cols="20" id="textArea1Notes" tabindex="18" onkeypress="return maxLengthKey(event, this, 800);"></textarea>

更省心的替代方案 #

现代浏览器里textarea原生支持maxlength属性，完全不用手写事件处理，直接加属性就能实现长度限制，还能兼容粘贴等场景：

<textarea name="textArea1" rows="2" cols="20" id="textArea1Notes" tabindex="18" maxlength="800"></textarea>

内容的提问来源于stack exchange，提问作者Clinton Avery