如何按選項文本而不是值對HTML下拉列表進行排序？

Question

當用戶單擊按鈕時，我正在使用jquery將額外的流派加載到HTML下拉列表中。 我想按選項文本而不是值的字母順序對下拉列表進行排序。

我的PHP流派數組看起來像

$genres = array (0=>"All", 200=>"Pop", 201=>"Classic Rock", ...etc

鍵號將作為下拉列表中的值加載，而文本將填充選項。

而我的jQuery

$.each(json, function(val, text)
{                   
    options[options.length] = new Option(text,val);
});

在下拉菜單中顯示

All
Pop
Classic Rock

即不是按字母順序

我的第一個計划是在php中對數組進行排序，但是在測試時，即使該數組是

 $genres = array (0=>"All", 201=>"Classic Rock", 200=>"Pop", ...etc

下拉菜單仍然顯示

All
Pop
Classic Rock

如何強制它按照接收json的順序對其進行排序？

謝謝你的幫助。

Answer 1

嘗試一下，

$(function(){
    var options = $("#select-box-id option");
    options.sort(function(a,b) {
        if (a.text > b.text) return 1; // .text for text comparison
        else if (a.text < b.text) return -1;
        else return 0
    });
    $("#select-box-id").html(options );
});

現場演示

Answer 2

如果排序是在服務器端進行的（最好是這樣）。

PHP有一對夫婦，讓您排序基於方法KEY - (ksort)或value - (asort)

您可以對數組執行此操作：

$genres = array (0=>"All", 200=>"Pop", 201=>"Classic Rock", ...etc
$stortedgeneres=$genres;
asort($stortedgeneres);

然后，您可以像以前一樣在此數組（$ sortedgeneres）上使用JavaScript進行遍歷。

參考：-http: //www.w3schools.com/php/php_arrays_sort.asp