Javascript .change（）仅在启用“多个”时对“选择”起作用

查看jQuery函数的最后一个演示

有人能给我解释一下为什么它可以在那里上下移动箭头，并且值会发生变化，但是如果我删除select上的

multiple

属性，我必须在它触发之前按enter键

---

有没有办法解决这个问题？

请记住，

更改

事件只有在输入元素的值更改时才会发生。当用户通过鼠标或键盘与多值选择进行交互时，值会发生更改-您可以在页面上的演示中看到，当显示元素的

值时

但是，对于单值选择，当您打开下拉菜单并将鼠标悬停在某个值上时，或者当您使用键盘执行相同操作时，值不会改变。因此，
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');
});

请参见此处的一个简单演示：
请记住，
更改事件仅在输入元素的值更改时发生。当用户通过鼠标或键盘与多值选择进行交互时，值会发生更改-您可以在页面上的演示中看到，当显示元素的
值时

但是，对于单值选择，当您打开下拉菜单并将鼠标悬停在某个值上时，或者当您使用键盘执行相同操作时，值不会改变。因此，
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');
});

这里有一个简单的演示：
我认为这种行为是由浏览器处理选择框上的键盘事件的方式引起的。对于单行选择字段，当值已更改且焦点移出字段时，会触发onchange事件，方法是按enter键或tab键或单击字段外的某个位置。
这在某些情况下是有意义的：例如，如果您希望根据用户的选择将用户重定向到不同的页面，您仍然希望他能够使用箭头键滚动字段，而无需在每次按键后重新加载页面

如果您明确希望在用户每次按字段上的箭头键时调用函数，请使用keyup事件。
我认为这种行为是由浏览器处理选择框上的键盘事件的方式引起的。对于单行选择字段，当值已更改且焦点移出字段时，会触发onchange事件，方法是按enter键或tab键或单击字段外的某个位置。
这在某些情况下是有意义的：例如，如果您希望根据用户的选择将用户重定向到不同的页面，您仍然希望他能够使用箭头键滚动字段，而无需在每次按键后重新加载页面

如果每次用户按下字段上的箭头键时都要显式地调用函数，请使用keyup事件。
您需要使用.keypress（）

页面如下：


通过使用.keypress（），您将在每次按下键（鼠标或键盘）时检查该值，并且它在大多数浏览器中都可以正常工作

Chrome在这方面有一个最值得注意的问题。
您需要使用.keypress（）

页面如下：


通过使用.keypress（），您将在每次按下键（鼠标或键盘）时检查该值，并且它在大多数浏览器中都可以正常工作

Chrome在这方面存在最显著的问题