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

Question

我试图围绕这个包裹我的头，并希望你能帮助。

我的目标是创建arrays每个key由variable设定的object这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()