使用jQuery拆分并将项目的哈希值附加到5个组中?

时间:2014-02-18 23:56:28

标签: javascript jquery ruby-on-rails

如何使用jQuery溢出并将项目的哈希附加到5个组中?在rails中我可以使用:in_groups_of()。 jQuery有类似的东西吗?

图片用于澄清目标:

HTML:

<div id="vehicle_model" style="display: none">
  <h3>Vehicle Model</h3>

  <table id="model" class="vehicle_options">
      <tr>
        <!-- model options -->
      </tr>
  </table>
<span id="model_selected"></span> 
</div>

jQuery的:

models = {"Acura":["CL", "ILX", "ILX Hybrid", "Integra", "Legend", "MDX", "NSX", "RDX", "RL", "RLX", "RSX", "SLX", "TL", "TLX", "TSX", "TSX Sport Wagon", "Vigor", "ZDX"]};

$.each(models["Acura"], function( key, value ) {
  $('#model tr').append('<td id=\"'+value+'\">'+value+'</td>');
});

1 个答案:

答案 0 :(得分:1)

我设法生成了你想要的结果。我创建了一个内部分页机制。

您可以在http://jsfiddle.net/SyyTL/7/

看到它的实际效果

我为此演示编写的代码如下:

function performRender() {
    var models = {
        "Acura": ["CL", "ILX", "ILX Hybrid", "Integra", "Legend", "MDX", "NSX", "RDX", "RL", "RLX", "RSX", "SLX", "TL", "TLX", "TSX", "TSX Sport Wagon", "Vigor", "ZDX"]
    };

    var pageSize = 5;

    var pageCount = models["Acura"].length / pageSize;

    for (var page = 0; page < pageCount; page++) {
        var pageElements = models["Acura"].slice(page * pageSize, (page + 1) * pageSize);
        debugger;
        var newTr = $('<tr />');
        $.each(pageElements, function (index, value) {
            $('<td />', {
                text: value
            }).appendTo(newTr);
        });

        newTr.appendTo('#model');
    }
}

$('button').click(function(){performRender();});

如果有帮助,请标记为答案。