2010-09-02 37 views
5

Thử một loạt các giải pháp không có kết quả khả thi. Tôi có mã lấy giá trị của khoảng và tạo ID cho LI. Sau đó tôi muốn sắp xếp các DESCENDING của LI dựa trên ID của LI. Cứu giúp? Cảm ơn!Cách sắp xếp LI dựa trên ID số

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 
<ul id="dumb"> 
    <li>cello<span>2987</span></li> 
    <li>zello<span>1723</span></li> 
    <li>aello<span>3476</span></li> 
</ul> 
<script type='text/javascript' src='JQUERY INCLUDE'></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $('ul li span').each(function(){ 
     var pubValue = $(this).html(); 
     $(this).parent().attr('id', pubValue); 
    }); 
}); 
</script> 
</body> 
</html> 
+0

tốt, không có id. Ý của bạn là bạn muốn sắp xếp theo văn bản span? – jAndy

+0

@jAndy: OP có "mã nhận giá trị của khoảng và tạo ID cho LI". Xem mã hiện có. – BoltClock

+0

Không, trong mô tả của tôi, tôi mô tả rằng mã đã có trong ví dụ của tôi tạo ID dựa trên giá trị của khoảng. Sau đó tôi muốn sắp xếp các LI bằng ID của họ (tất nhiên họ sẽ có ID tại thời điểm đó). – joe

Trả lời

10

Giả sử li nodes của bạn có id.

<ul id="test"> 
    <li id="4112">blub</li> 
    <li id="1422">blaaah</li> 
    <li id="6640">hmmmm</li> 
    <li id="2221">one more</li> 
</ul> 

Sau đó, bạn chỉ có thể gọi javascripts có nguồn gốc phương pháp mảng .sort(), kể từ jQuery bọc bộ đang giữ trong Arrays:

$(function(){ 
    var elems = $('#test').children('li').remove(); 
    elems.sort(function(a,b){ 
     return parseInt(a.id) > parseInt(b.id); 
    }); 
    $('#test').append(elems); 
}); 

dụ làm việc: http://www.jsfiddle.net/3uYUq/

+0

Đó là hoàn hảo, cảm ơn jAndy! – joe

+3

Dường như trong Safari, bạn cần '-' thay vì'> '. – user113716

+0

@patrick: thú vị, vì vậy bạn sẽ cần phải thay đổi thứ tự nếu bạn muốn có một danh sách tăng dần? – jAndy

4

jAndy đánh tôi đến cú đấm. Đây là của tôi.

$(function() { 
    $("li").sort(function(left, right) { 
    return parseInt($(left).attr("id")) - parseInt($(right).attr("id")); 
    }).each(function() { $("ul").append($(this)); }); 
}); 

Tôi sẽ thêm rằng bạn cần

$(function() { 

cho người dùng IE6 của bạn bởi vì IE6 sẽ sụp đổ nếu bạn cố gắng để loại bỏ các yếu tố từ các dom trước yếu tố cha mẹ của họ tải.

Ngoài ra, .remove() là thừa vì .append() quản lý điều đó.

Các vấn đề liên quan