输入框仅能输入单个字符求助：keypress事件异常排查

问题根源 #

你在keypress事件的处理函数中，把input.value = ""写在了判断回车的if语句外面。这会导致：

• 每次按下任意按键（包括输入字母、数字的普通按键），都会立刻清空输入框
• 只有按下回车时才会添加列表项，但输入过程中每敲一个字符就被清空，自然只能输入单个字符

而click事件的清空逻辑在添加列表项之后，且只有点击按钮时才触发，不会干扰正常输入，所以功能正常。

修正后的代码 #

把清空输入框的代码移到if块内部，确保只有按下回车并添加完列表项后才清空：

let button = document.getElementById("button");
let input = document.getElementById("userInput");
let ul = document.getElementById("list");

input.addEventListener("keypress", function(e){
    if(e.keyCode == 13){
        let li = document.createElement("li");
        li.appendChild(document.createTextNode(input.value))
        ul.appendChild(li);
        input.value = ""; // 移到if内部，仅回车时清空
    }
});

// 原click事件可保留
button.addEventListener("click", function(){
    let li = document.createElement("li");
    if(input.value.length > 0){
        li.appendChild(document.createTextNode(input.value))
        ul.appendChild(li);
        input.value = "";
    }
});

额外优化建议 #

• 用e.key === "Enter"替代e.keyCode == 13，keyCode已被标准废弃，e.key兼容性更优
• 给keypress事件也加上输入长度判断，避免添加空列表项

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