输入图书编号后如何清空输入框？解决两位数输入失效问题

嘿，我来帮你搞定这个问题！你现在遇到的情况，主要是两个小细节没处理对：

1. 你用了$('#input').val(' ')——注意这里括号里是个空格！这不是清空输入框，是给输入框塞了个空格字符，输入的时候自然会出问题。
2. 大概率你清空输入框的时机不对，如果在keypress事件里还没等用户输完就执行清空，那输第二个字符的时候输入框已经空了，当然没法输入两位数啦。

正确的做法很简单，分两步： #

• 真正清空输入框要用$('#input').val('')（括号里是空字符串，啥都没有）。
• 只在用户按下回车键（也就是提交图书编号的时候）才清空输入框，别在输入过程中瞎触发。

给你改好的示例代码 #

// 全局变量存图书编号
var array = new Array();

$(document).ready(function() {
    // 直接监听输入框的回车事件，别监听整个页面，更精准
    $('#input').on('keypress', function(e) {
        // 确认是按下了回车键
        if (e.key === 'Enter' || e.keyCode === 13) {
            e.preventDefault(); // 阻止默认的回车跳转/提交行为
            var bookId = $(this).val().trim(); // 拿到输入值，顺便去掉前后空格
            
            // 先验证下输入是不是有效的数字
            if (bookId && !isNaN(bookId)) {
                array.push(parseInt(bookId));
                // 这里加上你的升序排序逻辑
                array.sort(function(a, b) { return a - b; });
                console.log('当前已统计的图书编号（升序）：', array);
                
                // 提交完了再清空输入框，完美！
                $(this).val('');
            } else {
                alert('麻烦输入有效的数字编号哦～');
            }
        }
    });
});

额外给你提两个优化小建议： #

• 别监听整个document的keypress事件，直接监听输入框的事件，不会干扰页面上其他的输入操作。
• 加个输入验证，避免用户输入空格或者非数字的内容，让你的应用更健壮。

这样改完之后，你输入“23”这类两位数的时候，输完按下回车才会清空输入框，完全不会影响输入啦。

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