3

Есть элементы со значениями

<ul class="error_sorting">																				<li>
<progress class="progress progress-striped progress-danger" value="1" max="100">1%</progress></li>
<li>
<progress class="progress progress-striped progress-danger" value="1" max="100">1%</progress></li>
<li>
<progress class="progress progress-striped progress-danger" value="80" max="100">80%</progress></li>
<li>
<progress class="progress progress-striped progress-danger" value="10" max="100">10%</progress></li>
<li>
<progress class="progress progress-striped progress-warning" value="1" max="100">1%</progress></li>																																																																		</ul>

хочу отсортировать список

	$(document).ready(function() {
			var $elements = $('li progress value');
			var $target = $('.error_sorting');
			 
			$elements.sort(function (a, b) {
				var an = $(a).text(),
					bn = $(b).text();
				 
				if (an && bn) {
					return an.toUpperCase().localeCompare(bn.toUpperCase());
				}
				 
				return 0;
			});
			 
			$elements.detach().appendTo($target);
	});

но видимо, что-то делаю не так. не сортирует.

1 ответ 1

3

Непонятно, что Вы рассчитываете получить таким селектором: $('li progress value').

$(document).ready(function() {
  var $elements = $('ul.error_sorting > li');
  var $target = $('.error_sorting');

  $elements.sort(function(a, b) {
    var an = parseInt($(a).find('progress').attr('value')),
      bn = parseInt($(b).find('progress').attr('value'));
    return an - bn;
  });

  $elements.detach().appendTo($target);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="error_sorting">
  <li>
    <progress class="progress progress-striped progress-danger" value="1" max="100"> 1 % </progress></li>
  <li>
    <progress class="progress progress-striped progress-danger" value="1" max="100"> 1 % </progress></li>
  <li>
    <progress class="progress progress-striped progress-danger" value="80" max="100"> 80 % </progress></li>
  <li>
    <progress class="progress progress-striped progress-danger" value="10" max="100"> 10 % </progress></li>
  <li>
    <progress class="progress progress-striped progress-warning" value="1" max="100"> 1 % </progress></li>
</ul>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.