jQuery:如何通过变量设置对象键的数量和键值本身来创建数组对象？

Question

我正在考虑这件事，希望你能帮上忙。

我的目标是创建一个arrays的object，其中每个key由一个variable设置，此key的values是另一个array的过滤结果。

好吧，这写起来很复杂，下面是一个例子：

<!-- Markup -->
<section id="container">
    <article class="class-1">1</article>
    <article class="class-2">2</article>
    <article class="class-3">3</article>
    <article class="class-4">4</article>
    <article class="class-5">5</article>
    <article class="class-6">6</article>
    <article class="class-7">7</article>
    <article class="class-8">8</article>
    <article class="class-9">9</article>
</section>

//  Desired outcome:
//  plugin variables are
    { columns:3 }

var cols = {
    1 : [ $('.class-1') , $('.class-4') , $('.class-7') ],
    2 : [ $('.class-2') , $('.class-5') , $('.class-8') ],
    3 : [ $('.class-3') , $('.class-6') , $('.class-9') ]
};

// my jQuery so far:
// note : columns == 3

var cols =  $.map( $('article','#container') , function(item, i) {
                return {[ i%columns+1 : item ]};
            });

我如何才能在这里实现我需要的东西？我做错了什么？

任何帮助都将不胜感激。

感谢您的阅读，

Jannis

Answer 1

我想我明白你想做什么了。您希望文章在加载时自动排序到列的映射中，对吗？

我不认为.map会把你带到那里，因为它会返回一个数组。在您想要的输出中，您有一个对象，每个列都有键。我认为你想要的是这样的东西：

var columns = 3;
var cols = {};

$(document).ready(function(){
    $('article','#container').each(function(index, value){
        var col = index%columns + 1;
        if(cols[col] === undefined){
            cols[col] = [$(value)];
        } else {
            cols[col].push($(value));
        }
    });
});

Answer 2

如何使用about like this

var mapFunc = function(){ return $(this); },
    articles = $('#container article'),
    info = { columns: 3 },
    cols = {
        '1': articles.filter(':nth-child(3n + 1)').map(mapFunc).get(),
        '2': articles.filter(':nth-child(3n + 2)').map(mapFunc).get(),
        '3': articles.filter(':nth-child(3n + 3)').map(mapFunc).get()
    };

或者使用更动态的方法：

cols = {};    
for(var i = 1; i <= info.columns; i++)
    cols[i] = articles
        .filter(':nth-child(' + info.columns + 'n + ' + i + ')')
        .map(mapFunc).get()