Сортировка <лития> теги

Question

Сортировка <лития> теги

Так как EF не поддерживает ПОСТЕПЕННО, может быть трудно записать хорошие модульные тесты против. Это было одним из ударов против него в Вотум недоверия .

, Если Вы желаете записать хорошие тесты, EF повысит препятствия. Вы можете работа вокруг них , но это нетривиально.

6

javascript html sorting

задан PHPNooblet 30 September 2009 в 16:28

4 ответа

Вот еще один подход, крадущий идеи из других ответов, приведенных на данный момент (также требующих jQuery):

function sort(elementSelector, valueSelector, ascending) {
  var sign = ascending ? -1 : 1;
  var elements = jQuery(elementSelector);
  elements.each(function() {
    this.sortKey = jQuery(valueSelector, this).text();
  });
  var sorted = elements.get();
  sorted.sort(function(a, b) {
    var keyA = a.sortKey;
    var keyB = b.sortKey;
    return sign * ((keyA < keyB) - (keyA > keyB));
  });
  elements.parent().append(sorted);
}

sort('.column>li', '.name', true)

2

ответ дан 8 December 2019 в 17:24

Просто поддержите ответ jQuery выше, посмотрите это руководство: http://www.shopdev.co.uk/blog/sortable-lists-using-jquery-ui/

Для семантики вам может быть лучше также поместить имя класса внутри фактического

Тег .

Однако, помимо использования таблицы внутри списка, вы можете опубликовать пример страницы, чтобы помочь в дальнейшем.

0

ответ дан 8 December 2019 в 17:24

Мой ответ длиннее: p, но работайте.

function SortLIs() {
    var ColumnUL = $("ul.column");
    var Columns  = $(ColumnUL).children("li");
     
    var ColumnNames    = new Array();
    var Columns_byName = new Array();
    var Columns_Count  = Columns.length;
    for(var i = 0; i <  Columns_Count; i++) {
        var aColumn = Columns[i];
        var aTD     = $(aColumn).find(".name");
        var aTDName = aTD.text();
        ColumnNames.push(aTDName);
        Columns_byName[aTDName] = aColumn;

        $(aColumn).remove();
    }
     
    ColumnNames.sort(function(a, b){
        return (a >  b) - (a <  b);
    });
     
    for(var i = 0; i <  Columns_Count; i++) {
        var aName = ColumnNames[i];
        ColumnUL.append(Columns_byName[aName]);
    }
}

EDIT: Я видел, как вы сказали, что плохо разбираетесь в JS. Итак, вот вам общая картина.

(1) Добавьте следующий код в заголовок HTML. Это будет использовать библиотеку jQuery.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

(2) Добавьте код « sortLIs » сразу после приведенного выше кода.

<script>
<!--
function SortILs() {
    ...
}
-->
</script>

(3.1) Если вы хотите, чтобы сортировка начиналась во время загрузки. Добавьте это сразу после приведенного выше кода.

<script>
<!--
$(document).ready(function(){
    SortILs();
});
-->
</script>

(3.2) В противном случае вы вызываете функцию из события.

Надеюсь, это поможет.

3

ответ дан 8 December 2019 в 17:24

Другие вопросы по тегам:

javascript html sorting

Похожие вопросы:

score 9 · Accepted Answer

Using jQuery, this should do it:

function sort() {
    $($('ul.column>li').get().reverse()).each(function(outer) {
        var sorting = this;
        $($('ul.column>li').get().reverse()).each(function(inner) {
            if($('td.name', this).text().localeCompare($('td.name', sorting).text()) > 0) {
                this.parentNode.insertBefore(sorting.parentNode.removeChild(sorting), this);
            }
        });
    });
}

The above is a little dense though, so if you want to understand what's going on, let's break it down line-by-line:

function sort() {

    //get each <li> which is a child of <ul class="column">
    //for each element in the results, execute a function
    //also, we reversed the order (e.g. start at the bottom and go up
    $($('ul.column>li').get().reverse()).each(function(outer) {

        //this is the current <li> we're running against
        var sorting = this;

        //get the same set of elements again in their current state,
        //so we can figure out where to put this one
        $($('ul.column>li').get().reverse()).each(function(inner) {

            //get the inner text of the <td class="name">
            //for the item we're trying to replace,
            //and for the current item in the inner loop
            //use localeCompare to compare the two strings alphabetically
            if($('td.name', this).text().localeCompare($('td.name', sorting).text()) > 0) {

                //if the one we're trying to sort goes after the current one
                //alphabetically, remove it from its current position
                //and insert it after the current one
                this.parentNode.insertBefore(sorting.parentNode.removeChild(sorting), this);
            }
        });
    });
}

We can make it a little more reusable by passing in the selector for the list and the key:

sort('ul.column>li', 'td.name');

function sort(list, key) {
    $($(list).get().reverse()).each(function(outer) {
        var sorting = this;
        $($(list).get().reverse()).each(function(inner) {
            if($(key, this).text().localeCompare($(key, sorting).text()) > 0) {
                this.parentNode.insertBefore(sorting.parentNode.removeChild(sorting), this);
            }
        });
    });
}

Do keep in mind this requires jQuery, so you'll need a reference to it in your :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

And this function should be called at some point in the page after the list is written in the HTML.