цикл по массиву JSON в списке jQuery - PullRequest
Новая
       4

цикл по массиву JSON в списке jQuery

5 голосов
/ 29 июня 2011

У меня есть этот массив JSON 

// Json array
var productList = {"products": [
    {"description": "product 1", "price": "9.99"},
    {"description": "product 2", "price": "9.99"},
    {"description": "product 3", "price": "9.99"}
]
};

Я хочу, чтобы он просматривал мой список, но не знаю, как это сделать, пока все, что я могу сделать, - это перечислять один элемент за раз.Кроме того, я могу только перечислить продукт, а не продукт = цена.JQuery Forum Inst помогает ... спасибо !!

Вот остаток кода 

function loadList() {
//  var list = document.getElementById('productList');
    var list = $("#productList").listview();

    var listItem = document.createElement('li');
    listItem.setAttribute('id', 'listitem');

    listItem.innerHTML = productList.products[0].description;

    $(list).append(listItem);
    $(list).listview("refresh");

и HTML-файл 

<html xmlns:f="http://www.lipso.com/f" xmlns:l="http://www.lipso.com/v2/lml" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<head>
    <title>Page Title</title>
    &meta;
    <script src="@=site.cfg.resources.url@/test.js"></script>
</head>
<body onLoad="loadList()">
<div data-role="page">
    <div data-role="header" id="header">
        <h1>Dynamic Product List</h1>
    </div>
    <div data-role="content" id="content">
        <ul id="productList" data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
        </ul>
    </div>
</div>
</body>
</html>

Ответы [ 4 ]

13 голосов
/ 29 июня 2011

Поскольку вы уже используете jQuery, почему бы вам не использовать функцию $. Each () ?

Вместо этого кода: 

var listItem = document.createElement('li');
listItem.setAttribute('id', 'listitem');

listItem.innerHTML = productList.products[0].description;

$(list).append(listItem);

Используйте это: 

$(productList.products).each(function(index){
    $(list).append('<li id="listitem">' + this.description + " = " + this.price + '</li>');
});
3 голосов
/ 29 июня 2011

Проверить jQuery.each () 

$.each(productList.products, function(index, value) {
   $(list).append('<li>' + value.description + ': ' + value.price + '</li>');
});
0 голосов
/ 29 июня 2011

Мне кажется, что вам действительно нужен плагин .tmpl для построения вашего списка из ваших данных json:

http://api.jquery.com/jquery.tmpl/

0 голосов
/ 29 июня 2011

Используя описанный ниже «массив JSON» или лучше названный объект JavaScript, вы можете перебирать его, используя циклы for. productlist - это объект, который содержит массив, и каждый элемент в этом массиве является объектом, который содержит 2 свойства или переменные (описание и цена). Массив может быть повторен, хотя с использованием типичного цикла for, начинающегося с 0 и заканчивающегося с длиной массива - 1 .... объекты внутри каждого элемента массива могут быть перебраны с использованием нотации "for (key in object)". 

// Json array
var productList = {"products": [
    {"description": "product 1", "price": "9.99"},
    {"description": "product 2", "price": "9.99"},
    {"description": "product 3", "price": "9.99"}
]
};

Вот пример итерации вашего объекта Javascript. 

for (var i = 0; i < productList.products.length; i ++) {
  for (var key in productList.products) {
    alert(key + ":" + productList.products[key]);
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...