JQuery drop-down list box operation and sorting, jquery drop-down list box

JQuery drop-down list box operation and sorting, jquery drop-down list box

Sort the options in the <select> </select> label. option has two attributes: text and value.

Because text is usually displayed, it is not the sorting field we want to sort, but value is hidden.

So we can sort by value.

PS: when you use the drop-down list box to select an item, use $ (this). selected = true instead.

$ (This). attr ('selected', true) is good, because in some cases, the former may not be usable,

I have a personal experience.

Sort js as follows (introduce jQuery)

xx=$('#complete option').sort(function(a,b){      var aText = $(a).val();      var bText = $(b).val();      if(aText>bText) return 1;      if(aText<bText) return -1;      return 0;  }) ; $('#complete').empty();$('#complete').append(xx);

The following content is copied. Save it and check it later...

<Script language = "javascript"> $ (document ). ready (function () {// bind the drop-down box change event. When the drop-down box changes, call the SelectChange () method $ ("# selectID "). change (function () {SelectChange () ;}) function SelectChange () {// obtain the text attribute value of the selected item in the drop-down box var selectText =$ ("# selectID "). find ("option: selected "). text (); alert (selectText); // obtain the value Attribute value of the selected item in the drop-down box var selectValue = $ ("# selectID "). val (); alert (selectValue); // obtain the index attribute value var selectIndex = $ ("# selectID") of the selected item in the drop-down box "). get (0 ). selectedIndex; alert (selectIndex); // obtain the maximum index attribute value var selectMaxIndex = $ ("# selectID option: last") in the drop-down box "). attr ("index"); alert (selectMaxIndex);} function aa () {// select $ ("# selectID") if the index attribute of the drop-down box is set to 5 "). get (0 ). selectedIndex = 5;} function bb () {// select $ ("# selectID") for the option with the value attribute 4 in the drop-down box "). val (4);} function cc () {// select the $ ("# selectID option [text = 5]") option for setting the text attribute of the drop-down box to 5. attr ("selected", "selected"); $ ("# yyt option: contains ('5 ')"). attr ("selected", true);} function dd () {// Add an option $ ("# selectID") at the end of the drop-down box "). append ("<option value = '7'> 7 </option>");} function ee () {// Add an option $ ("# selectID") at the beginning of the drop-down box "). prepend ("<option value = '0'> 0 </option>")} function ff () {// remove the last option in the drop-down box $ ("# selectID option: last "). remove ();} function gg () {// remove option $ ("# selectID option [index = 1]") for the index attribute of the drop-down box. remove ();} function hh () {// remove the option $ ("# selectID option [value = 4]") whose value attribute is 4 in the drop-down box. remove ();} function ii () {// remove the option $ ("# selectID option [text = 5]") whose text attribute is 5 from the drop-down box. remove () ;}</script>