Question

以下代码按.dataCard属性的值对data-cardNumber元素进行排序，然后按顺序将它们附加到#main。

如何将其附加到#left或#right？

我希望它在#left或#right之间做出决定来衡量#left和#right的高度并进行比较。

如果#left更高/更长，则附加到#right，如果#right更高/更长，则追加到#left，如果它们都是相同的高度，那么附加到#left。

var m = $('#main .dataCard').sort(function(a, b){
    return $(a).data('cardnumber') - $(b).data('cardnumber');
}).appendTo('#main');

我非常感谢任何和所有帮助实现根据高度对一列或另一列进行排序。

提前致谢！ }

Answer 1

在迭代.dataCard时，您可以执行以下操作来检查高度并相应地附加.dataCard。

var x = $('#main .dataCard').sort(function (a, b) {
    return $(a).data('cardnumber') - $(b).data('cardnumber');
});

for(var i = 0; i < x.length;i++){
    if($('#left').height() <= $('#right').height()){
        $('#left').append(x[i]);
    }
    else
        $('#right').append(x[i]);  
});

http://jsfiddle.net/trevordowdle/p9q6h/2/

Answer 2

fiddle Demo

var left = $('#left'), //cache selector
    right = $('#right'), //cache selector
    append_to_div;
if (left.height() < right.height()) { //compare height
    append_to_div = right;
} else {
    var append_to_div = left;
}

var x = $('#main .dataCard').sort(function (a, b) {
    return $(a).data('cardnumber') - $(b).data('cardnumber');
});

append_to_div.html(x); //html will add new list of items where as append will add items top previous elements

<小时/> 在OP的评论

之后更新

Updated fiddle Demo

var left = $('#left'),
    right = $('#right'),
    l = [],
    r = [];

var x = $('#main .dataCard').sort(function (a, b) {
    return $(a).data('cardnumber') - $(b).data('cardnumber');
});
for (var i = 0; i < left.children().length; i++) {
    l.push(x[i]);
}
for (var i = left.children().length; i < left.children().length + right.children().length; i++) {
    r.push(x[i]);
}
left.html(l);
right.html(r);

<小时/> 上述代码

的更短更好的版本

Updated fiddle Demo

var left = $('#left'),
    right = $('#right'),
    arr = [];

var x = $('#main .dataCard').sort(function (a, b) {
    return $(a).data('cardnumber') - $(b).data('cardnumber');
});
arr = $.makeArray(x);
left.html(arr.slice(0, left.children().length));
right.html(arr.slice(left.children().length));

Answer 3

每次只检查left和right的高度并进行比较。

var toAppend,
    $left = $("#left"),
    $right = $("#right");

$left.height() > $right.height() ? toAppend = $right : toAppend = $left;

立即使用toAppend变量。

附加到两列之一，然后是其他列

3 个答案: