これは単純な問題ですが、解決できません。言うまでもなく、私はjavascriptが初めてです。
ドロップダウンリストをアルファベット順に並べ替えました選択された値があるため、最初のオプションを除きます。ユーザーが別の値を選択した場合、その選択肢を最初のオプションに、残りをアルファベット順にしたいです。
これを行うにはjavascriptでソートする必要がありますか、または「リストの一番上に追加する」機能がありますか？
htmlの並べ替えは、並べ替えの小枝です。私はjs関数を使用していません...
html
<div class = "dropdowns">
<select id = "dropdown">
<option selected> name </option>
{% for key, value in Informations|sort %}
<option value="{{ key }}"> {{ value }} </option>
{% endfor %}
</select>
</div>
js
// Set textfield input to selected dropdown option
var myTextBox = document.getElementById("Infos");
var myDropdown = document.getElementById("dropdown");
document.addEventListener("DOMContentLoaded", function(event) {
$("select").change().append($("#dropdown"));
// $("#dropdown").val($("#dropdown option:select").val());
// myDropdown.value = myTextBox.value
})
myDropdown.onchange = function () {
myTextBox.value = this.value;
}
myDropdown.value = myTextBox.value
回答：
回答№1は2これがあなたのニーズを確実に解決することを願っています。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(document).on("change","#dropdown",function(){
$(this).html($("option",this).sort(function(a,b)
{
if(a.text == b.text)
{
return 0;
}
if(a.text > b.text)
{
return 1;
}
else
{
return -1;
}
}));
var hold = $("option:selected",this).detach();
$(this).prepend(hold);
});
});
</script>
<body>
<div class = "dropdowns">
<select id = "dropdown">
<option selected> x</option>
<option>a</option>
<option>r</option>
<option>d</option>
<option>c</option>
</select>
</div>
</body>