.change（）僅適用於多選時

Question

查看最近演示的.change() jQuery函數。

有人可以向我解釋爲什麼它在那裏工作，箭頭上下移動並且值發生變化，但是如果我刪除了select的multiple屬性，我必須在它觸發之前始終打開回車？

有沒有辦法解決這個問題？

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/

Answer 2

我認爲，行爲的方式瀏覽器造成了處理鍵盤事件選擇框。對於單行選擇字段，當值更改並且焦點移出字段時，可以通過按Enter鍵或Tab鍵或單擊字段外的某個位置來觸發onchange事件。 這在某些情況下很有意義：例如，如果您希望根據用戶的選擇將用戶重定向到其他頁面，您仍然希望他能夠使用箭頭鍵滾動字段，而無需在每次按鍵後重新加載頁面。

如果您每次用戶在字段上按下箭頭鍵時都明確要調用函數，請使用keyup事件。

Answer 3

你會想要使用.keypress（）來代替。

這裏的頁面：

http://api.jquery.com/keypress/

通過使用.keypress（），你會在每次按鍵時（鼠標或鍵盤）檢查的價值，它應該工作在大多數瀏覽器的罰款。

Chrome對此有最顯着的問題。