Jquery根据div元素状态排序列表

Question

我有一个每行包含一个div的列表。每个div的一个元素是标签。标签包含位于地图(也在阴影区域)中的标记的进出信息。我希望它们按照标签的进出状态进行排序。到目前为止，我所做的是拥有下面的代码。用户可以改变阴影区域的比例，从而改变标记的状态。因此，该列表应根据地图上标记的状态进行更新。所有IN标记应放在列表的顶部，out标记应放在INs之后。

**我有30行这样做的方法。我想用这个方法。

A是我的测试循环代码，以确保我有我的in/Out标签html属性正确。B是目前不能工作的代码。任何人都可以熟悉，请看看什么是缺失的代码。

提前感谢。

Html代码

<div id="divsec_13A North Buderim Bvd Buderim" name="13A North Buderim Bvd Buderim">
    <input type="checkbox" name="checkbox_13A  North Buderim Bvd Buderim" id="4" value="13A North Buderim Bvd Buderim">
    <a onclick="$.fn.centerMarker('13A  North Buderim Bvd Buderim');">13A  North Buderim Bvd Buderim</a>
    <label type="label" name="inOut_13A  North Buderim Bvd BuderimLabel" id="inOut_13A  North Buderim Bvd BuderimLabel" class="inOutControl">In</label>
</div>

PS:列表是这样的

复选框| address1 | In

复选框| address2 | Out

复选框| address3 | In

复选框| address4 | Out

)

$(this.children()).each(function (ind){                 
      var html = $(this).children().filter(".inOutControl").html();
      alert(html);  
}); 

B)

   $("#list").sort(sortTest);
        var sortTest = function(a,b){   
            //return $(a).find(".inOutControl").html() > $(b).find(".inOutControl").html() ? 1 : -1;        
            return $(this, a).filter(".inOutControl").html() != $(this, b).filter(".inOutControl").html() ? 1 : -1;  
        };

PS:类似的，但我不知道为什么不工作

Answer 1

如果有人需要的话，这是可行的…

$("#list").sortList();
$.fn.sortList = function(){
        var $list = $(this);
        var listItems = $list.children().get(); 
        listItems.sort( function(a,b){
            return $( a).find(".inOutControl").html() > $( b).find(".inOutControl").html() ? 1 : -1;  
        });
        $.each(listItems, function(idx, itm){$list.append(itm);});
        return this;
    };