Сортировка Выбрать параметры с помощью JQuery

Question

Следующее работает для одного select на странице.

$(document).ready(function(){
  $('.quantity option').sort(function (a, b) {
    var optValA = parseFloat( $(a).attr('value'));
    var optValB = parseFloat( $(b).attr('value'));
    return (optValA < optValB) ? -1 : (optValA > optValB) ? 1 : 0;
  }).appendTo('.quantity');
});

У меня есть 2 или более select на странице. Я также хочу сохранить опцию selected.

Answer 1

Попробуйте это

Я сделал функцию, в которой вы передаете выбор

Затем вы можете отсортировать по одному или все

Оказывается, вы не потеряетевыбранное значение

function sortSel($sel) {
  // const selectedValue = $sel.val(); // not actually needed
  $('option', $sel).sort(function(a, b) {
    var optValA = parseFloat($(a).attr('value'));
    var optValB = parseFloat($(b).attr('value'));
    return (optValA < optValB) ? -1 : (optValA > optValB) ? 1 : 0;
  }).appendTo($sel);
  // $sel.val(selectedValue); // not needed 
}

// sortSel($(".sel1")); // one at a time
// sortSel($(".sel2"));

$("select").each(function() {
  sortSel($(this))
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="sel1">
  <option value="">Please select</option>
  <option value="0.3" selected>C</option>
  <option value="0.1">A</option>
  <option value="0.2">B</option>
</select>

<select class="sel2">
  <option value="">Please select</option>
  <option value="1.3" selected>C</option>
  <option value="1.1">A</option>
  <option value="1.2">B</option>
</select>

Answer 2

Если вы хотите отсортировать несколько из них, вы можете сделать это следующим образом:

$(document).ready(function() {
  $('.quantity').each(function() {
    $('option', this).sort(function(a, b) {
      var optValA = parseFloat($(a).attr('value'));
      var optValB = parseFloat($(b).attr('value'));
      return (optValA < optValB) ? -1 : (optValA > optValB) ? 1 : 0;
    }).appendTo(this);
  });
});

Демо

$(document).ready(function() {
  $('.quantity').each(function() {
    $('option', this).sort(function(a, b) {
      var optValA = parseFloat($(a).attr('value'));
      var optValB = parseFloat($(b).attr('value'));
      return (optValA < optValB) ? -1 : (optValA > optValB) ? 1 : 0;
    }).appendTo(this);
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="quantity">
  <option value="1">1</option>
  <option value="3">3</option>
  <option value="5">5</option>
  <option value="2">2</option>
  <option value="7">7</option>
</select>

<select class="quantity">
  <option value="5">5</option>
  <option value="4">4</option>
  <option value="2">2</option>
  <option value="6">6</option>
  <option value="9">9</option>
</select>

<select class="quantity">
  <option value="1">1</option>
  <option value="3">3</option>
  <option value="5">5</option>
  <option value="2">2</option>
  <option value="7">7</option>
</select>