英文:
Sorting divs using jQuery - 2 columns, 1 column, 2 columns etc
问题
我想使用 jQuery 对 div 进行排序。有一些带有 class col-sm-6 和 col-sm-12 的 div。
应该显示如下:
col-sm-6 col-sm-6
col-sm-12
col-sm-6 col-sm-6
col-sm-12
等等。
这些是 div:
<div class="row">
<f:for each="{items}" as="data">
<div class="col col-sm-{data.width}" data-width="{data.width}"></div>
</f:for>
</div>
这是我目前的代码:
$('.col:not(.d-none)').sort(function(a, b) {
return ???;
}).appendTo('.row');
英文:
I want to sort divs using jQuery. There are divs with class col-sm-6 and col-sm-12.
It should appear as follows:
col-sm-6 col-sm-6
col-sm-12
col-sm-6 col-sm-6
col-sm-12
etc.
these are the divs:
<div class="row">
<f:for each="{items}" as="data">
<div class="col col-sm-{data.width}" data-width="{data.width}"></div>
</f:for>
</div>
and that's the code I have so far:
$('.col:not(.d-none)').sort( function(a,b) {
return ???;
}).appendTo('.row');
Does somebody has any idea?
答案1
得分: 0
以下是程序员建议的内容:
var elementIndex = 1;
$('.col').each(function(i, obj) {
if (!$(obj).hasClass('d-none')) {
if (elementIndex == 3) {
$(obj).removeClass('col-sm-6');
$(obj).addClass('col-sm-12');
elementIndex = 1;
} else {
$(obj).removeClass('col-sm-12');
$(obj).addClass('col-sm-6');
elementIndex++;
}
}
});
这不是我想要的完全内容,但还可以。
英文:
This is what the programmer suggested to me:
var elementIndex = 1;
$('.col').each(function(i, obj) {
if ( !$(obj).hasClass('d-none') ) {
if ( elementIndex == 3 ) {
$(obj).removeClass('col-sm-6');
$(obj).addClass('col-sm-12');
elementIndex = 1;
} else {
$(obj).removeClass('col-sm-12');
$(obj).addClass('col-sm-6');
elementIndex++;
}
}
});
It's not exactly what i wanted, but ok.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论