javascript - .change() 仅适用于当多个打开时的选择

Question

查看 .change() 的最后一个演示jQuery 函数。

有人可以向我解释为什么它可以用上下箭头移动并且值发生变化，但是如果我删除选择上的 multiple 属性，我必须在它触发之前始终按 Enter 键？

有办法解决吗？

Answer 1

请记住，change 事件仅在输入元素的值发生更改时才会发生。当用户与多值选择交互时，无论是通过鼠标还是使用键盘，值都会发生变化 - 您可以在页面上的演示中看到，作为元素的 value被展示。

但是，对于单个值选择，当您打开下拉列表并将鼠标悬停在某个值上时，或者使用键盘执行相同操作时，该值不会更改。因此，change 事件工作正常。

<小时/>

如果您想“解决”此问题，您始终可以使用 keydown 事件来捕获值的更改并使用它。这是此类函数的一个简单示例:

$('select').focus(function() {
    var v = this.value,
        t = $(this),
        c = t.children(':selected'); // Store the currently selected 
                                     // option element in a variable

    t.keydown(function(e) {
        switch (e.keyCode) {
        case 38:
        case 37:
            c = c.prev().length ? c.prev() : c;
            break;
        case 40:
        case 39:
            c = c.next().length ? c.next() : c;
            break;
        }

        // Do something with this information
        console.log(c.text());
    });
}).blur(function() {
    $(this).unbind('keydown');
});

在这里查看一个简单的演示:http://jsfiddle.net/yijiang/UWaut/