如何校验输入仅含有效字符？禁止仅空格/换行提交的JS代码为何不生效？

第一段代码问题 #

• 逻辑运算符优先级错误：!msgInpt.innerText === ' ' 中!优先级高于===，实际运算逻辑为(!msgInpt.innerText) === ' '，布尔值和字符串比较结果永远为false，导致第一个分支永远不执行，所有逻辑都走else分支，直接禁止了所有空格、回车输入，完全不符合需求。
• 校验逻辑覆盖不全：仅判断内容是否等于单个空格，没有覆盖多个空格、全是换行、空格加换行混合的全空白场景。
• 误拦截合法输入：else分支中直接禁止了shift+Enter换行操作，不符合允许用户输入换行的需求。
• 时序问题：keydown事件触发时，当前按下的字符还未写入元素的innerText中，拿到的是按键前的旧内容，校验结果不准确。

第二段代码问题 #

• 仍存在逻辑运算符优先级错误：!msgInpt.innerText === ' '的问题没有修复，导致postChat()永远不会被触发，输入有效内容也无法发送消息。
• 同样没有覆盖多空白字符混合的全空白校验场景。
• else分支还是禁止了空格和shift+Enter换行，不满足合法输入的允许规则。
• 同样存在keydown阶段内容未更新的时序问题。

核心思路：不拦截用户正常的空格、换行输入，仅在用户按下回车发送消息时做内容校验，只要内容去除首尾空白后存在有效字符，就允许发送。

完整代码 #

HTML #

<div contenteditable="true" id="message"></div>

CSS #

div{
  background-color: #f2f2f4;
  padding: 12px;
  height: 150px;
  border: 2px solid #333;
  border-radius: 10px;
  box-shadow: 0px 0px 12px 4px rgba(0,0,0,0.18);
}

JS #

let msgInpt = document.getElementById("message");
msgInpt.addEventListener("keydown", function(entEvt){
    // 仅拦截非Shift组合的回车键，其余输入（空格、Shift+回车换行）全部放行
    if (entEvt.code === 'Enter' && !entEvt.shiftKey) {
        entEvt.preventDefault();
        // 去除首尾所有空白字符（空格、换行、制表符等）后判断是否有有效内容
        const validContent = msgInpt.innerText.trim();
        if (validContent) {
            postChat();
            // 可选：发送成功后清空输入框
            msgInpt.innerText = '';
        }
    }
});

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