基于属性'data- Sort‘对jQuery中的div进行排序？
基于属性'data- Sort‘对jQuery中的div进行排序？
提问于 2011-05-26 12:35:14
如果我有几个div：
<div data-sort='1'>div1</div>
<div data-sort='4'>div4</div>
<div data-sort='8'>div8</div>
<div data-sort='12'>div12</div>
<div data-sort='19'>div19</div>我动态地创建了div：
<div data-sort='14'>div1</div>
<div data-sort='6'>div1</div>
<div data-sort='9'>div1</div>如何才能让它们只排序到已经按顺序加载的div中，而不必重新加载所有的div？
我认为我需要构建一个包含屏幕上所有div的数据排序值的数组，然后查看新div的位置，但我不确定这是否是最好的方法。
回答 2
Stack Overflow用户
回答已采纳
发布于 2011-05-26 12:47:38
使用此函数
var result = $('div').sort(function (a, b) {
var contentA =parseInt( $(a).data('sort'));
var contentB =parseInt( $(b).data('sort'));
return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
});
$('#mylist').html(result);您可以在添加新div后立即调用此函数。
如果您希望在div中保留javascript事件，请不要使用上面示例中的html替换。请改用：
$(targetSelector).sort(function (a, b) {
// ...
}).appendTo($container);Stack Overflow用户
发布于 2015-02-19 10:54:28
我使用它对一个图片库进行排序，其中的排序数组将通过ajax调用进行更改。希望它能对某些人有用。
var myArray = ['2', '3', '1'];
var elArray = [];
$('.imgs').each(function() {
elArray[$(this).data('image-id')] = $(this);
});
$.each(myArray,function(index,value){
$('#container').append(elArray[value]);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div id='container'>
<div class="imgs" data-image-id='1'>1</div>
<div class="imgs" data-image-id='2'>2</div>
<div class="imgs" data-image-id='3'>3</div>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6133723
复制相关文章
相似问题
腾讯云开发者
