Question

我有一个数组和一个空的下拉列表。我需要用我的数组填充我的下拉列表。但是，选择项目应该使其成为列表中的第一项，并且列表应该从那里按字母顺序继续。这就是我所拥有的，但下拉列表最初不应按字母顺序排列。一旦有人选择了一个项目，它应该只按字母顺序排列。

使用Javascript：

var array = ["vintage", "frames", "treats", "engraved", "stickers", "jewelerybox", "flask"];



    array.sort(function(val1, val2) {
      return val1.localeCompare(val2);
    });

    var select = document.getElementById("dropdownList");

    for (var i = 0; i < array.length; i++) {

      select.innerHTML += '<option>' + array[i] + '</option>';

    }

HTML：

<select id="dropdownList">

</select>

Answer 1

select.onchange = function() {
    var selectedText = select.selectedOptions[0].textContent;//get text of selected item
    select.innerHTML = '';//remove everything form select
    array.sort(function(val1, val2) {//sort array
        if (val1 === selectedText) {//val1 should be on first if its equal to selectedText
            return -1
        } else if (val2 === selectedText) {//val1 should be on first if its equal to selectedText
            return 1;
        } else {
            return val1.localeCompare(val2);
        }
    });
    for (var i = 0; i < array.length; i++) {//add everything back
        select.innerHTML += '<option>' + array[i] + '</option>';//consider using document.createElement
    }  
}

从数组中选择一个项目，并将该项目作为列表中的第一个项目

1 个答案: