blocks|key|1772500|text|在IE6中，它似乎是按嵌套数组的项进行排序的：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1772501|function+sortSelect(selectToSort)+{
++++var+arrOptions+=+[];

++++for+(var+i+=+0;+i+<+selectToSort.options.length;+i%2B%2B)++{
++++++++arrOptions[i]+=+[];
++++++++arrOptions[i][0]+=+selectToSort.options[i].value;
++++++++arrOptions[i][1]+=+selectToSort.options[i].text;
++++++++arrOptions[i][2]+=+selectToSort.options[i].selected;
++++}

++++arrOptions.sort();

++++for+(var+i+=+0;+i+<+selectToSort.options.length;+i%2B%2B)++{
++++++++selectToSort.options[i].value+=+arrOptions[i][0];
++++++++selectToSort.options[i].text+=+arrOptions[i][1];
++++++++selectToSort.options[i].selected+=+arrOptions[i][2];
++++}
}|code-block|syntax|javascript|1772502|我会看看这是否能在其他浏览器中工作...|1772503|编辑:它也可以在Firefox中工作，哇哦！|1772504|有没有比这更简单的方法呢？javascript或jQuery中有没有内置的方法可以对我遗漏的选择进行排序，或者这是最好的方法？|1772505|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Well, in IE6 it seems to sort on the nested array's [0] item:

<pre><code>function sortSelect(selectToSort) {
 var arrOptions = [];

 for (var i = 0; i &lt; selectToSort.options.length; i++) {
 arrOptions[i] = [];
 arrOptions[i][0] = selectToSort.options[i].value;
 arrOptions[i][1] = selectToSort.options[i].text;
 arrOptions[i][2] = selectToSort.options[i].selected;
 }

 arrOptions.sort();

 for (var i = 0; i &lt; selectToSort.options.length; i++) {
 selectToSort.options[i].value = arrOptions[i][0];
 selectToSort.options[i].text = arrOptions[i][1];
 selectToSort.options[i].selected = arrOptions[i][2];
 }
}
</code></pre>

I'll see if this works in other browsers...

Edit: it works in Firefox too, woo hoo!

Is there an easier way than this though? is there some method built into javascript or jQuery that sorts selects that I am missing, or is this the best way?

blocks|key|1772579|text|Array.sort()默认将每个元素转换为字符串，并比较这些值。因此，["value",+"text",+"selected"]被排序为"value,+text,+selected"。在大多数情况下，这可能会工作得很好。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1772580|如果您确实希望仅对值进行排序，或者将值解释为数字，则可以将比较函数传递给sort()：|1772581|arrOptions.sort(function(a,b)+{+return+new+Number(a[0])+-+new+Number(b[0]);+});|code-block|syntax|javascript|1772582|entityMap^0|0|C|10|T|1X|N|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]|$9|T|A|U|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|V|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|W|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|X|8|@]|D|@]|E|$]]]|N|$]]

<code>Array.sort()</code> defaults to converting each element to a string, and comparing those values. So <code>["value", "text", "selected"]</code> gets sorted as <code>"value, text, selected"</code>. Which will probably work fine, most of the time. 

If you do want to sort on value alone, or interpret value as a number, then you can pass a comparison function into sort():

<pre><code>arrOptions.sort(function(a,b) { return new Number(a[0]) - new Number(b[0]); });
</code></pre>

blocks|key|1772657|text|有一个应该可以工作的排序的a+closed+jQuery+ticket，但并没有包含在核心中。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1772658|jQuery.fn.sort+=+function()+{
++return+this.pushStack(+[].sort.apply(+this,+arguments+),+[]);
};|code-block|syntax|javascript|1772659|从a+Google+Groups+thread引用，我认为您只需传入一个用于排序的函数，如下所示|1772660|function+sortSelect(selectToSort)+{
++++jQuery(selectToSort.options).sort(function(a,b){+
++++++++return+a.value+>+b.value+?+1+:+-1;+
++++});
}|1772661|希望它能帮上忙！|1772662|entityMap|0|LINK|mutability|MUTABLE|url|http://dev.jquery.com/ticket/255|1|http://groups.google.com/group/jquery-en/browse_thread/thread/e0d6c199552dd1f7/2f05ad6d400dd962?lnk=gst&q=array%2Bsorting^0|D|M|0|0|0|1|M|1|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@$A|Z|B|10|1|11]]|C|$]]|$1|D|3|E|5|F|7|12|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|13|8|@]|9|@$A|14|B|15|1|16]]|C|$]]|$1|K|3|L|5|F|7|17|8|@]|9|@]|C|$G|H]]|$1|M|3|N|5|6|7|18|8|@]|9|@]|C|$]]|$1|O|3|-4|5|6|7|19|8|@]|9|@]|C|$]]]|P|$Q|$5|R|S|T|C|$U|V]]|W|$5|R|S|T|C|$U|X]]]]

There's <a href="http://dev.jquery.com/ticket/255" rel="noreferrer">a closed jQuery ticket</a> for a sort that should work, but just wasn't included in the core.

<pre><code>jQuery.fn.sort = function() {
 return this.pushStack( [].sort.apply( this, arguments ), []);
};
</code></pre>

Referenced from <a href="http://groups.google.com/group/jquery-en/browse_thread/thread/e0d6c199552dd1f7/2f05ad6d400dd962?lnk=gst&amp;q=array+sorting" rel="noreferrer">a Google Groups thread</a>, I think you just pass in a function that is used to sort, like so

<pre><code>function sortSelect(selectToSort) {
 jQuery(selectToSort.options).sort(function(a,b){ 
 return a.value &gt; b.value ? 1 : -1; 
 });
}
</code></pre>

Hope it helps!

blocks|key|1557478|text|将选项提取到一个临时数组中，排序，然后重建列表：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1557479|var+my_options+=+$("#my_select+option");
var+selected+=+$("#my_select").val();

my_options.sort(function(a,b)+{
++++if+(a.text+>+b.text)+return+1;
++++if+(a.text+<+b.text)+return+-1;
++++return+0
})

$("#my_select").empty().append(+my_options+);
$("#my_select").val(selected);|code-block|syntax|javascript|1557480|Mozilla's+sort+documentation+(特别是compareFunction)和Wikipedia's+Sorting+Algorithm+page是相关的。|offset|length|1557481|如果要使排序不区分大小写，请用text.toLowerCase()替换text|style|CODE|1557482|上面显示的排序函数演示了如何排序。准确地对非英语语言进行排序可能很复杂(请参阅unicode+collation+algorithm)。在排序函数中使用localeCompare是一个很好的解决方案，例如：|1557483|my_options.sort(function(a,b)+{
++++return+a.text.localeCompare(b.text);
});|1557484|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/sort|1|http://en.wikipedia.org/wiki/Sorting_algorithm|2|http://www.unicode.org/reports/tr10/|3|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare^0|0|0|0|S|0|1E|Y|1|0|F|I|Z|4|0|13|R|2|24|D|3|0|0^^$0|@$1|2|3|4|5|6|7|16|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|17|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|18|8|@]|9|@$I|19|J|1A|1|1B]|$I|1C|J|1D|1|1E]]|A|$]]|$1|K|3|L|5|6|7|1F|8|@$I|1G|J|1H|M|N]|$I|1I|J|1J|M|N]]|9|@]|A|$]]|$1|O|3|P|5|6|7|1K|8|@]|9|@$I|1L|J|1M|1|1N]|$I|1O|J|1P|1|1Q]]|A|$]]|$1|Q|3|R|5|D|7|1R|8|@]|9|@]|A|$E|F]]|$1|S|3|-4|5|6|7|1S|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z]]|10|$5|V|W|X|A|$Y|11]]|12|$5|V|W|X|A|$Y|13]]|14|$5|V|W|X|A|$Y|15]]]]

Extract options into a temporary array, sort, then rebuild the list:

<pre><code>var my_options = $("#my_select option");
var selected = $("#my_select").val();

my_options.sort(function(a,b) {
 if (a.text &gt; b.text) return 1;
 if (a.text &lt; b.text) return -1;
 return 0
})

$("#my_select").empty().append( my_options );
$("#my_select").val(selected);
</code></pre>

<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/sort" rel="noreferrer" title="Mozilla&#39;s sort documentation">Mozilla's sort documentation</a> (specifically the compareFunction) and <a href="http://en.wikipedia.org/wiki/Sorting_algorithm" rel="noreferrer">Wikipedia's Sorting Algorithm page</a> are relevant.

If you want to make the sort case insensitive, replace <code>text</code> with <code>text.toLowerCase()</code>

The sort function shown above illustrates how to sort. Sorting non-english languages accurately can be complex (see the <a href="http://www.unicode.org/reports/tr10/" rel="noreferrer">unicode collation algorithm</a>). Using <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare" rel="noreferrer">localeCompare</a> in the sort function is a good solution, eg:

<pre><code>my_options.sort(function(a,b) {
 return a.text.localeCompare(b.text);
});
</code></pre>

blocks|key|1772752|text|我刚刚将Mark的想法包装在一个jquery函数中|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1772753|$('#your_select_box').sort_select_box();|code-block|syntax|javascript|1772754|JQuery函数：|1772755|$.fn.sort_select_box+=+function(){
++++var+my_options+=+$("#"+%2B+this.attr('id')+%2B+'+option');
++++my_options.sort(function(a,b)+{
++++++++if+(a.text+>+b.text)+return+1;
++++++++else+if+(a.text+<+b.text)+return+-1;
++++++++else+return+0
++++})
+++return+my_options;
}|1772756|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

I've just wrapped Mark's idea in a jquery function

<pre><code>$('#your_select_box').sort_select_box();
</code></pre>

JQuery function: 

<pre><code>$.fn.sort_select_box = function(){
 var my_options = $("#" + this.attr('id') + ' option');
 my_options.sort(function(a,b) {
 if (a.text &gt; b.text) return 1;
 else if (a.text &lt; b.text) return -1;
 else return 0
 })
 return my_options;
}
</code></pre>

blocks|key|1772787|text|稍微修改了Tom上面的答案，这样它实际上修改了要排序的选择框的内容，而不仅仅是返回排序的元素。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1772788|$('#your_select_box').sort_select_box();|code-block|syntax|javascript|1772789|jQuery函数：|1772790|$.fn.sort_select_box+=+function(){
++++//+Get+options+from+select+box
++++var+my_options+=+$("#"+%2B+this.attr('id')+%2B+'+option');
++++//+sort+alphabetically
++++my_options.sort(function(a,b)+{
++++++++if+(a.text+>+b.text)+return+1;
++++++++else+if+(a.text+<+b.text)+return+-1;
++++++++else+return+0
++++})
+++//replace+with+sorted+my_options;
+++$(this).empty().append(+my_options+);

+++//+clearing+any+selections
+++$("#"%2Bthis.attr('id')%2B"+option").attr('selected',+false);
}|1772791|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Modified Tom's answer above slightly so that it actually modifies the contents of the select box to be sorted, rather than just returning the sorted elements.

<pre><code>$('#your_select_box').sort_select_box();
</code></pre>

jQuery function:

<pre><code>$.fn.sort_select_box = function(){
 // Get options from select box
 var my_options = $("#" + this.attr('id') + ' option');
 // sort alphabetically
 my_options.sort(function(a,b) {
 if (a.text &gt; b.text) return 1;
 else if (a.text &lt; b.text) return -1;
 else return 0
 })
 //replace with sorted my_options;
 $(this).empty().append( my_options );

 // clearing any selections
 $("#"+this.attr('id')+" option").attr('selected', false);
}
</code></pre>

blocks|key|1772839|text|请记住:如果要使用上下文选择器，仅连接ID将不起作用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1772840|$.fn.sort_select_box+=+function(){
++++var+my_options+=+$("option",+$(this));
++++my_options.sort(function(a,b)+{
++++++++if+(a.text+>+b.text)+return+1;
++++++++else+if+(a.text+<+b.text)+return+-1;
++++++++else+return+0
++++});
++++$(this).empty().append(my_options);
}

//+Usando:
$("select#ProdutoFornecedorId",+$($context)).sort_select_box();|code-block|syntax|javascript|1772841|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Remember: if you want to use context selector, just concatenate the ID will not work

<pre><code>$.fn.sort_select_box = function(){
 var my_options = $("option", $(this));
 my_options.sort(function(a,b) {
 if (a.text &gt; b.text) return 1;
 else if (a.text &lt; b.text) return -1;
 else return 0
 });
 $(this).empty().append(my_options);
}

// Usando:
$("select#ProdutoFornecedorId", $($context)).sort_select_box();
</code></pre>

blocks|key|1557629|text|这是一个更好的解决方案。将全局函数声明为JQuery|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1557630|$.fn.sortSelect+=+function()+{
++++var+op+=+this.children("option");
++++op.sort(function(a,+b)+{
++++++++return+a.text+>+b.text+?+1+:+-1;
++++})
++++return+this.empty().append(op);
}|code-block|syntax|javascript|1557631|并从代码中调用该函数。|1557632|$("#my_select").sortSelect();|1557633|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

This is a better solution.
Declare a global function to JQuery

<pre><code>$.fn.sortSelect = function() {
 var op = this.children("option");
 op.sort(function(a, b) {
 return a.text &gt; b.text ? 1 : -1;
 })
 return this.empty().append(op);
}
</code></pre>

And call the function from the code.

<pre><code>$("#my_select").sortSelect();
</code></pre>

blocks|key|1772901|text|我在对@Juan+Perez的评论中提到的解决方案|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1772902|$.fn.sortOptions+=+function(){
++++$(this).each(function(){
++++++++var+op+=+$(this).children("option");
++++++++op.sort(function(a,+b)+{
++++++++++++return+a.text+>+b.text+?+1+:+-1;
++++++++})
++++++++return+$(this).empty().append(op);
++++});
}|code-block|syntax|javascript|1772903|用法：|1772904|$("select").sortOptions();|1772905|这仍然可以改进，但我不需要添加更多的铃声或口哨:)|1772906|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

The solution I mentioned in my comment to @Juan Perez

<pre><code>$.fn.sortOptions = function(){
 $(this).each(function(){
 var op = $(this).children("option");
 op.sort(function(a, b) {
 return a.text &gt; b.text ? 1 : -1;
 })
 return $(this).empty().append(op);
 });
}
</code></pre>

Usage:

<pre><code>$("select").sortOptions();
</code></pre>

This can still be improved on, but I didn't need to add any more bells or whistles :)

blocks|key|1557761|text|虽然有点晚，但我已经实现了一个更复杂的函数，您可以将其包含在泛型中。它有几个不同的输出选项。它还可以根据标签递归到<OPTGROUP>标签中。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1557762|$.fn.sortSelect+=+function(options){

++++const+OPTIONS_DEFAULT+=+{
++++++++recursive:++++++true,+++//+Recurse+into+<optgroup>
++++++++reverse:++++++++false,++//+Reverse+order
++++++++useValues:++++++false,++//+Use+values+instead+of+text+for+<option>+(<optgruop>+is+always+label+based)
++++++++blankFirst:+++++true,+++//+Force+placeholder+<option>+with+empty+value+first,+ignores+reverse
++++}

++++if+(typeof+options+!=+"object"+%7C%7C+null+===+options)+{
++++++++options+=+OPTIONS_DEFAULT;
++++}

++++var+sortOptions+=+function($root,+$node,+options){

++++++++if+($node.length+!=+1)+{
++++++++++++return+false;
++++++++}

++++++++if+($node[0].tagName+!=+"SELECT"+&&+$node[0].tagName+!=+"OPTGROUP")+{
++++++++++++return+false;
++++++++}

++++++++if+(options.recursive)+{
++++++++++++$node.children('optgroup').each(function(k,+v){
++++++++++++++++return+sortOptions($root,+$(v),+options);
++++++++++++});
++++++++}

++++++++var+$options++++++++=+$node.children('option,+optgroup');
++++++++var+$optionsSorted++=+$options.sort(function(a,+b){

++++++++++++if+(options.blankFirst)+{
++++++++++++++++if+(a.tagName+==+"OPTION"+&&+a.value+==+"")+{
++++++++++++++++++++return+-1;
++++++++++++++++}

++++++++++++++++if+(b.tagName+==+"OPTION"+&&+b.value+==+"")+{
++++++++++++++++++++return+1;
++++++++++++++++}
++++++++++++}

++++++++++++var+textA+=+(a.tagName+==+"OPTION"+?+(options.useValues+?+a.value+:+a.text)+:+a.label);
++++++++++++var+textB+=+(b.tagName+==+"OPTION"+?+(options.useValues+?+a.value+:+b.text)+:+b.label);

++++++++++++if+(textA+>+textB)+{
++++++++++++++++return+options.reverse+?+-1+:+1;
++++++++++++}

++++++++++++if+(textA+<+textB)+{
++++++++++++++++return+options.reverse+?+1+:+-1;
++++++++++++}

++++++++++++return+0;

++++++++});

++++++++$options.remove();
++++++++$optionsSorted.appendTo($node);

++++++++return+true;

++++};

++++var+selected+=+$(this).val();
++++var+sorted+=+sortOptions($(this),+$(this),+{...OPTIONS_DEFAULT,+...options});
++++$(this).val(selected);

++++return+sorted;

};|code-block|syntax|javascript|1557763|然后，您可以在任何<SELECT>标记上调用sortSelect()函数，或者只调用单个<OPTGROUP>来仅对组的选项进行排序。|1557764|示例：|1557765|$('select').sortSelect();|1557766|使用"+Reverse“选项进行反向排序：|1557767|$('select').sortSelect({
++++reverse:+true
});|1557768|您可以自动将其应用于所有选择，也许只有当它们包含一个重要的类(例如，"js-sort")时才会这样：|1557769|$('select.js-sort').each(function(k,+v){
++++$(v).sortSelect();
});|1557770|entityMap^0|1L|A|0|0|9|8|M|C|18|A|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@$9|11|A|12|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|13|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|14|8|@$9|15|A|16|B|C]|$9|17|A|18|B|C]|$9|19|A|1A|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|1B|8|@]|D|@]|E|$]]|$1|O|3|P|5|H|7|1C|8|@]|D|@]|E|$I|J]]|$1|Q|3|R|5|6|7|1D|8|@]|D|@]|E|$]]|$1|S|3|T|5|H|7|1E|8|@]|D|@]|E|$I|J]]|$1|U|3|V|5|6|7|1F|8|@]|D|@]|E|$]]|$1|W|3|X|5|H|7|1G|8|@]|D|@]|E|$I|J]]|$1|Y|3|-4|5|6|7|1H|8|@]|D|@]|E|$]]]|Z|$]]

A bit late but for what it's worth I've implemented a more complex function you can include generically. It has a few options for varied output. It can also recurse into <code>&lt;OPTGROUP&gt;</code> tags based on their label.

<pre><code>$.fn.sortSelect = function(options){

 const OPTIONS_DEFAULT = {
 recursive: true, // Recurse into &lt;optgroup&gt;
 reverse: false, // Reverse order
 useValues: false, // Use values instead of text for &lt;option&gt; (&lt;optgruop&gt; is always label based)
 blankFirst: true, // Force placeholder &lt;option&gt; with empty value first, ignores reverse
 }

 if (typeof options != "object" || null === options) {
 options = OPTIONS_DEFAULT;
 }

 var sortOptions = function($root, $node, options){

 if ($node.length != 1) {
 return false;
 }

 if ($node[0].tagName != "SELECT" &amp;&amp; $node[0].tagName != "OPTGROUP") {
 return false;
 }

 if (options.recursive) {
 $node.children('optgroup').each(function(k, v){
 return sortOptions($root, $(v), options);
 });
 }

 var $options = $node.children('option, optgroup');
 var $optionsSorted = $options.sort(function(a, b){

 if (options.blankFirst) {
 if (a.tagName == "OPTION" &amp;&amp; a.value == "") {
 return -1;
 }

 if (b.tagName == "OPTION" &amp;&amp; b.value == "") {
 return 1;
 }
 }

 var textA = (a.tagName == "OPTION" ? (options.useValues ? a.value : a.text) : a.label);
 var textB = (b.tagName == "OPTION" ? (options.useValues ? a.value : b.text) : b.label);

 if (textA &gt; textB) {
 return options.reverse ? -1 : 1;
 }

 if (textA &lt; textB) {
 return options.reverse ? 1 : -1;
 }

 return 0;

 });

 $options.remove();
 $optionsSorted.appendTo($node);

 return true;

 };

 var selected = $(this).val();
 var sorted = sortOptions($(this), $(this), {...OPTIONS_DEFAULT, ...options});
 $(this).val(selected);

 return sorted;

};
</code></pre>

You can then call the <code>sortSelect()</code> function on any <code>&lt;SELECT&gt;</code> tag, or just a single <code>&lt;OPTGROUP&gt;</code> to only sort a group's options.

Example:

<pre><code>$('select').sortSelect();
</code></pre>

Reverse order using the "reverse" option:

<pre><code>$('select').sortSelect({
 reverse: true
});
</code></pre>

You could apply this to all selects automatically, perhaps only if they include an important class (e.g. "js-sort") with this:

<pre><code>$('select.js-sort').each(function(k, v){
 $(v).sortSelect();
});
</code></pre>

blocks|key|1557798|text|对于html+select元素中的排序选项，jquery似乎仍然没有特别的帮助。下面是一些简单的javascript代码，用于排序选项：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1557799|​|1557800|function+sortOptionsByText(a,b)+{
++//+I+keep+an+empty+value+option+on+top,+b.value+comparison+to+0+might+not+be+necessary+if+empty+value+is+always+on+top...
++if+(a.value.length==0+%7C%7C+(b.value.length>0+&&+a.text+<=+b.text))+return+-1;+//+no+sort:+a,+b
++return+1;+//+sort+switches+places:+b,+a
}
function+sortOptionsByValue(a,b)+{
++if+(a.value+<=+b.value)+return+-1;+//+a,+b
++return+1;+//+b,+a
}
function+clearChildren(elem)+{
++if+(elem)+{
++++while+(elem.firstChild)+{
++++++elem.removeChild(elem.firstChild);
++++}
++}
}
function+sortSelectElem(sel,byText)+{
++const+val=sel.value;
++const+tmp=[...sel.options];
++tmp.sort(byText?sortOptionsByText:sortOptionsByValue);
++clearChildren(sel);
++sel.append(...tmp);
++sel.value=val;
}|code-block|syntax|javascript|1557801|RACE:+<select+id="list"+size="6">
++<option+value="">--PICK+ONE--</option>
++<option+value="1">HUMANOID</option>
++<option+value="2">AMPHIBIAN</option>
++<option+value="3">REPTILE</option>
++<option+value="4">INSECTOID</option>
</select> 
<button+type="button"+onclick="sortSelectElem(document.getElementById('list'));">SORT+LIST+BY+VALUE</button> 
<button+type="button"+onclick="sortSelectElem(document.getElementById('list'),true);">SORT+LIST+BY+TEXT</button>|1557802|1557803|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

Seems jquery still is not particularly helpful enough for sorting options in a html select element.
Here is some plain-plain javascript code for sorting options:
<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function sortOptionsByText(a,b) {
 // I keep an empty value option on top, b.value comparison to 0 might not be necessary if empty value is always on top...
 if (a.value.length==0 || (b.value.length&gt;0 &amp;&amp; a.text &lt;= b.text)) return -1; // no sort: a, b
 return 1; // sort switches places: b, a
}
function sortOptionsByValue(a,b) {
 if (a.value &lt;= b.value) return -1; // a, b
 return 1; // b, a
}
function clearChildren(elem) {
 if (elem) {
 while (elem.firstChild) {
 elem.removeChild(elem.firstChild);
 }
 }
}
function sortSelectElem(sel,byText) {
 const val=sel.value;
 const tmp=[...sel.options];
 tmp.sort(byText?sortOptionsByText:sortOptionsByValue);
 clearChildren(sel);
 sel.append(...tmp);
 sel.value=val;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>RACE: &lt;select id="list" size="6"&gt;
 &lt;option value=""&gt;--PICK ONE--&lt;/option&gt;
 &lt;option value="1"&gt;HUMANOID&lt;/option&gt;
 &lt;option value="2"&gt;AMPHIBIAN&lt;/option&gt;
 &lt;option value="3"&gt;REPTILE&lt;/option&gt;
 &lt;option value="4"&gt;INSECTOID&lt;/option&gt;
&lt;/select&gt;&lt;br&gt;
&lt;button type="button" onclick="sortSelectElem(document.getElementById('list'));"&gt;SORT LIST BY VALUE&lt;/button&gt;&lt;br&gt;
&lt;button type="button" onclick="sortSelectElem(document.getElementById('list'),true);"&gt;SORT LIST BY TEXT&lt;/button&gt;</code></pre>
</div>
</div>

blocks|key|1773039|text|在使用jquery时，这对我在Chrome中很有效，因为它可以对数据库中未排序的元素进行排序。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1773040|$(document).ready(function(){
++++
++++var+$list+=+$("#my_select");
++++var+selected+=+$("#my_select").val();+//save+selected+value
++++
++++$list.children().detach().sort(function(a,+b)+{
++++++++return+$(a).text().localeCompare($(b).text());
++++++}).appendTo($list);++//do+the+sorting+locale+for+latin+chars
++++
++++$("#my_select").val(selected);+//select+previous+selected+value

});|code-block|syntax|javascript|1773041|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

With jquery this worked for me in Chrome in order to sort a select made from database unsorted elements.
<pre><code>$(document).ready(function(){
 
 var $list = $(&quot;#my_select&quot;);
 var selected = $(&quot;#my_select&quot;).val(); //save selected value
 
 $list.children().detach().sort(function(a, b) {
 return $(a).text().localeCompare($(b).text());
 }).appendTo($list); //do the sorting locale for latin chars
 
 $(&quot;#my_select&quot;).val(selected); //select previous selected value

});
</code></pre>

I have jQuery but I'm not sure if it has any built-in sorting helpers. I could make a 2d array of each item's <code>text</code>, <code>value</code>, and <code>selected</code> properties, but I don't think that javascript's built in <code>Array.sort()</code> would work correctly.

What is the most efficient way to sort an Html Select's Options by value, while preserving the currently selected item?

数据库

jQuery

我有jQuery，但我不确定它是否有内置的排序助手。我可以为每个项目的text、value和selected属性创建一个二维数组，但我不认为Array.sort()中内置的javascript会正常工作。

问要按值对Html Select的选项进行排序，同时保留当前选定的项目，最有效的方法是什么？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问要按值对Html Select的选项进行排序，同时保留当前选定的项目，最有效的方法是什么？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问要按值对Html Select的选项进行排序，同时保留当前选定的项目，最有效的方法是什么？
EN