Сортировка выпадающего списка с помощью Javascript

Я хочу сортировать выпадающие элементы с помощью javascript, может ли кто-нибудь сказать мне, как это сделать.

  • Почему захват группы приводит к двойному соответствию регулярному выражению
  • Установите значение по умолчанию для поля ввода даты HTML5 с помощью angularJS
  • Воспроизведение HTML5-видео на IPad и поиск
  • Помощь в анализе даты ISO 8601 в Javascript
  • JQuery Smooth Scroll To DIV - использование значения ID из ссылки
  • Как получить надежные результаты транспортира?
  • Javascript получает значения из множественного окна выбора опций
  • Выпадающее поле зависит от параметра, выбранного в другом раскрывающемся списке
  • Показывать второе раскрывающееся меню, основанное на предыдущем выпадающем списке
  • Показать выпадающее меню в jQuery?
  • Copy / Clone выпадающий список с выбранной опцией в jquery
  • Используйте jquery, чтобы выбрать раскрывающийся список
  • 5 Solutions collect form web for “Сортировка выпадающего списка с помощью Javascript”

    Вы можете использовать jQuery и что-то вроде этого:

    $("#id").html($("#id option").sort(function (a, b) { return a.text == b.text ? 0 : a.text < b.text ? -1 : 1 })) 

    Но, вероятно, лучше спросить, почему и что вы пытаетесь достичь.

     <select id="foo" size="10"> <option value="3">three</option> <option value="1">one</option> <option value="0">zero</option> <option value="2">two</option> </select> <script> // WARN: won't handle OPTGROUPs! var sel = document.getElementById('foo'); // convert OPTIONs NodeList to an Array // - keep in mind that we're using the original OPTION objects var ary = (function(nl) { var a = []; for (var i = 0, len = nl.length; i < len; i++) a.push(nl.item(i)); return a; })(sel.options); // sort OPTIONs Array ary.sort(function(a,b){ // sort by "value"? (numeric comparison) // NOTE: please remember what ".value" means for OPTION objects return a.value - b.value; // or by "label"? (lexicographic comparison) - case sensitive //return a.text < b.text ? -1 : a.text > b.text ? 1 : 0; // or by "label"? (lexicographic comparison) - case insensitive //var aText = a.text.toLowerCase(); //var bText = b.text.toLowerCase(); //return aText < bText ? -1 : aText > bText ? 1 : 0; }); // remove all OPTIONs from SELECT (don't worry, the original // OPTION objects are still referenced in "ary") ;-) for (var i = 0, len = ary.length; i < len; i++) sel.remove(ary[i].index); // (re)add re-ordered OPTIONs to SELECT for (var i = 0, len = ary.length; i < len; i++) sel.add(ary[i], null); </script> 

    Поместите значения параметров и текст в массив, отсортируйте массив, а затем замените существующие элементы элементов новыми элементами, созданными из отсортированного массива.

    Вы можете попробовать функцию сортировки JQuery для этой работы –

    Попробуй это

    HTML-код –

     <select id="ddlList"> <option value="3">Three</option> <option value="1">One</option> <option value="1">one</option> <option value="1">a</option> <option value="1">b</option> <option value="1">A</option> <option value="1">B</option> <option value="0">Zero</option> <option value="2">Two</option> <option value="8">Eight</option> </select> 

    JQUERY CODE –

     $("#ddlList").html($('#ddlList option').sort(function(x, y) { return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1; })); $("#ddlList").get(0).selectedIndex = 0; e.preventDefault(); 

    ИЛИ

    Вы также можете использовать сортировку массивов для этого –

    Попробуй это

      var options = $('#ddlList option'); var arr = options.map(function (_, o) { return { t: $(o).text(), v: o.value }; }).get(); arr.sort(function (o1, o2) { return o1.t.toUpperCase() > o2.t.toUpperCase() ? 1 : o1.t.toUpperCase() < o2.t.toUpperCase() ? -1 : 0; }); options.each(function (i, o) { o.value = arr[i].v; $(o).text(arr[i].t); }); 

    ЗАВИСИТ ОТ ДВОРЦЫ

     function SortOptions(id) { var prePrepend = "#"; if (id.match("^#") == "#") prePrepend = ""; $(prePrepend + id).html($(prePrepend + id + " option").sort( function (a, b) { return a.text == b.text ? 0 : a.text < b.text ? -1 : 1 }) ); } 

    Примеры:

    <Select id = "my-list-id"> сортируется с помощью:

     SortOptions("#my-list-id"); 

    ИЛИ

     SortOptions("my-list-id"); 
    JavaScript делает сайт умным, красочным и простым использованием.