Jquery 每个和 JSON 数组答案

【问题标题】：Jquery each and JSON arrayJquery 每个和 JSON 数组
【发布时间】：2014-02-01 19:44:18
【问题描述】：

我有一个返回数组字符串的 div：

<div class="overview"><%=getCurrentAttribute('item','item_specs_json','""')%></div>

如下所示的数组字符串：

[{"k":"type","v":"blue"},{"k":"size","v":"large"}]

我正在制作一个项目符号列表，每页有 25 个 div.overview 实例。
这有效，但仅重复每个 div 的第一项值。我不能让这个循环每个。
有没有可能用我所拥有的来做到这一点？

$(function () {
    var specs = $.parseJSON($(".overview").html());
    $("div.overview").html('<div class="bullet_spec"></div>');
    $.each(specs, function () {
        $('div.overview div').append('<ul class="specs"><li class="label">' + this.k + ' : ' + this.v + '</li></ul>');
    });
});

我试过了：

$('.overview').each(function () {

这会破坏脚本。
另外仅供参考，当脚本中断时，唯一值会以完整的数组字符串格式正确显示在项目上。

【问题讨论】：

它有效，jsfiddle.net/LsAXD/1

标签： javascript jquery arrays json each

【解决方案1】：

如果您有多个“概览”元素，则必须遍历该列表。

$('.overview').each(function() {
  var $overview = $(this), specs = $.parseJSON($overview.html());
  $overview.html('<div class="bullet_spec"></div>');
  $.each(specs, function () {
    $overview.children('div').append('<ul class="specs"><li class="label">' + this.k + ' : ' + this.v + '</li></ul>');
  });
});

【讨论】：

【解决方案2】：

我正在考虑 '我正在从中制作一个项目符号列表，每页有 25 个实例' 表示有 25 个.overview，每个都有自己的 JSON。您可以遍历每一个，将每个 JSON 字符串映射到元素集合，并在末尾附加集合：

$('.overview').each(function(){
   var theJSON = JSON.parse(this.innerHTML);
   $elems = $.map(theJSON, function(k,v){
     return $('<ul class="specs"><li class="label">' + k.k + ' : ' + k.v + '</li></ul>');
   });
   $spec = $('<div class="bullet_spec"></div>').append($elems);
   $(this).html($spec);
});

JSFiddle

【讨论】：