自定義選擇菜單，jQuery不工作

Question

我想通過製作一個自定義菜單來複制標準選擇菜單的功能。

問題是我無法讓它表現得像一個選擇菜單。我的目標是能夠在單擊列表項目時替換「選定」文本。我也試圖讓菜單在用戶點擊菜單之外時關閉。

這裏是我的JS小提琴鏈接：

http://jsfiddle.net/dg7Lc/9/

我明白任何見解！謝謝！

-D

Answer 1

至於修復您的代碼，您需要更改$('.selected').appendTo('.custom-select span');到$('.custom-select span').html($('.custom-select ul li.selected').html());

http://jsfiddle.net/dg7Lc/13/

關於選擇列表的事情是，它們是由瀏覽器/ OS的設計，還幾個onclick/onblur動作和複雜的動作時，按Tab鍵和按其他鍵。

這樣說，你可能想看看一個jQuery的選擇框插件。我強烈建議https://github.com/fnagel/jquery-ui，因爲我發現它是跨瀏覽器最一致的，同時仍然像選擇框一樣工作。

他們的代碼很複雜（就像在顯示的背後有一個隱藏的選擇框），但這一切都是必需的。從我的個人經驗來看，這個插件非常容易設計和定製。