取消选中所有项目后,将选中的项目移至顶部

时间:2013-08-22 11:40:39

标签: javascript jquery html sorting

我实施了一个解决方案,使用

将选中的项目移到列表顶部

Keep checked items at top of list

现在,我有一个锚点取消选中列表中的所有项目。单击锚标记后,项目将被取消选中。但物品没有排序。它应该默认为第一个显示的列表,如在html列表中:

var list = $("ul"),
    origOrder = list.children();

list.on("click", ":checkbox", function () {
    var i, checked = document.createDocumentFragment(),
        unchecked = document.createDocumentFragment();
    for (i = 0; i < origOrder.length; i++) {
        if (origOrder[i].getElementsByTagName("input")[0].checked) {
            checked.appendChild(origOrder[i]);
        } else {
            unchecked.appendChild(origOrder[i]);
        }
    }
    list.append(checked).append(unchecked);
});

可以在此处找到该场景的演示 http://jsfiddle.net/RPN3x/

1 个答案:

答案 0 :(得分:1)

JS中的

      var list = $("ul");
var html=$("ul").html();
    sortItems(list);       
    var anch = $('#clear');
list.on('click',"a",function(){   
    var list = $("ul"); //$(this).parents().eq(0).find(':checkbox').removeAttr('checked');
  $("ul").html(html);  
                             sortItems(list);
});
function sortItems(list){
     origOrder = list.children();
    list.on("click", ":checkbox", function() {
        var i, checked = document.createDocumentFragment(),
            unchecked = document.createDocumentFragment();
        for (i = 2; i < origOrder.length; i++) {
            if (origOrder[i].getElementsByTagName("input")[0].checked) {
                checked.appendChild(origOrder[i]);
            } else {
                unchecked.appendChild(origOrder[i]);
            }
        }
        list.append(checked).append(unchecked);
    });
}

参见 DEMO