сортировка divs с помощью jQuery

Question

Я пытаюсь использовать sort divs с помощью jQuery, он сортирует, но не сортируется правильно.

Это после применения sort

HTML здесь сниппет.

<div class="container column"> 
    <div class="row"> 
     <section class="col-md-10 col-md-offset-3"> 
      <section class="col-md-2 col-md-offset-1"><a href="./stafferLink/index.php" >Staffer Link</a></section> 
      <section class="col-md-2 col-md-offset-1"><a href="./stafferLink/view.php">View Data</a></section> 
     </section> 
    </div> 
</div> 

и jQuery

var $divs = $(".container.column"); 

$(document).ready(function() { 
    var alphabeticallyOrderedDivs = $divs.sort(function (a, b) { 
     return $(a).find("a:first").text() > $(b).find("a:first").text(); 
    }); 
    $("#container").html(alphabeticallyOrderedDivs); 
}); 

PS: #container является внешний div, который содержит все divs, которые должны быть в порядке.

Here it's

извините, не responsive

Answer 1

Это вопрос корпус пытаются сортировать ваш элемент объявление игнорировать регистр и используя localCompare функцию.

Метод localeCompare() возвращает число, указывающее, идет ли ссылка строки до или после или такой же, как в данном строки в порядке сортировки.

Код:

var alphabeticallyOrderedDivs = $divs.sort(function (a, b) { 
    return $(a).find("a:first").text().toLowerCase().localeCompare($(b).find("a:first").text().toLowerCase());   
}); 

Демо: http://jsfiddle.net/bk66on10/

Ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare

Answer 2

Действительно, это как раз о правильной функции для сортировки. Для объектов jQuery нет сортировки, в основном это используется Array.prototype.sort. Если вы проверяете документацию:

Если поставляется опция compareFunction, элементы массива сортируются в соответствии с возвращаемым значением функции сравнения. Если a и b сравниваются с двумя элементами, то:

Если compareFunction (a, b) меньше 0, сортируйте a с более низким индексом, чем b, то есть первым на первый.

Если compareFunction (a, b) возвращает 0, оставьте a и b без изменений относительно друг друга, но отсортированы относительно всех разных элементов. Примечание. Стандарт ECMAscript не гарантирует такого поведения, и, таким образом, не все браузеры (например, версии Mozilla, датированные как минимум 2003 годом).

Если compareFunction (a, b) больше 0, сортируйте b до более низкого индекса, чем a. compareFunction (a, b) всегда должен возвращать одно и то же значение при задании определенной пары элементов a и b в качестве двух аргументов. Если возвращаются несогласованные результаты, порядок сортировки не определен.

Что вы делаете:

return $(a).find("a:first").text() > $(b).find("a:first").text(); 

который в зависимости от того, как своего рода делает сравнение, истинные или ложные значения могут быть литыми 1 или 0, но никогда -1.

Там пример на MDN о том, как работать с ним:

var items = [ 
    { name: 'Edward', value: 21 }, 
    { name: 'Sharpe', value: 37 }, 
    { name: 'And', value: 45 }, 
    { name: 'The', value: -12 }, 
    { name: 'Magnetic' }, 
    { name: 'Zeros', value: 37 } 
]; 
items.sort(function (a, b) { 
    if (a.name > b.name) { 
    return 1; 
    } 
    if (a.name < b.name) { 
    return -1; 
    } 
    // a must be equal to b 
    return 0; 
}); 

Посетите страницу MDN на Array.prototype.sort:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort