javascript - 空格键和退格反转的 Keyup 函数事件

Question

e.which事件功能有一些烦人的问题。每当我编写一个简单的 on keyup 代码并检查按下了哪个键时，它基本上都会做我想做的错误事情！

http://jsbin.com/axosuz/1/edit

试试看，如果你在其他任何东西之前按退格键，它会附加单词列表，上下左右和多个班次也是如此。这很烦人，并试图想出一个解决办法。

$('textarea').keyup(function (e) {
    var list = ['key', 'keep', 'king', 'kept'];
    if(e.which !== 32){
    for (var i = 0; i < list.length; i++) {
        if (list[i].toLowerCase().indexOf($(this).val()) === 0) {
            $('#div').append('<span class="autosuggest">' + list[i] + '&nbsp;</span>');
        } else if (list[i].toLowerCase().indexOf($(this).val()) === -1) {
            $('#div').html('');
        }
    }
   }
});

Answer 1

如果在没有输入时出现问题，请检查是否有输入。

演示

^{（对不起，我不能使用 jsbin）}

首先，将值访问移至范围的顶部。

var value = $(this).val();

然后检查 value 是否有任何字符。否则我们甚至不需要循环。

if (!value.length) return;

完成的代码：

$('textarea').keyup(function () {
    var list = ['key', 'keep', 'king', 'kept'],
        value = $(this).val();

    if (!value.length) return;

    for (var i = 0; i < list.length; i++) {
        if (list[i].toLowerCase().indexOf(value) === 0) {
            $('#div').append('<span class="autosuggest">' + list[i] + '&nbsp;</span>');
        } else if (list[i].toLowerCase().indexOf(value) === -1) {
            $('#div').html('');
        }
    }
});