Question

目前我正在为我的商店使用此插件 - link

在其javascript代码中，我可以定义自己的项目列表

 var items = [{
    id: '1',
    title: 'Lake',
    thumb: 'img/thumb/1.jpg',
    image: 'img/1.jpg',
    price: 2.99,
    photographer: 'Bob',
    tag: 'myTag',
    description: 'Et '
}, {
    id: '2',
    title: 'Travel',
    thumb: 'img/thumb/2.jpg',
    image: 'img/2.jpg',
    price: 3.99,
    photographer: 'Paolo',
    tag: 'myTag',
    description: 'Vidit'
}, {
    id: '3',
    title: 'Mountains',
    thumb: 'img/thumb/3.jpg',
    image: 'img/3.jpg',
    price: 1.40,
    photographer: 'Michele',
    tag: 'myTag',
    description: 'Causae '
}, {
    id: '4',
    title: 'Paris',
    thumb: 'img/thumb/4.jpg',
    image: 'img/4.jpg',
    price: 5.88,
    photographer: 'Ettore',
    tag: 'myTag',
    description: 'Cu'
}, {
    id: '5',
    title: 'Passion',
    thumb: 'img/thumb/5.jpg',
    image: 'img/5.jpg',
    price: 1.99,
    photographer: 'paolo',
    tag: 'myTag',
    description: 'Vidit'
}, {
    id: '6',
    title: 'Map',
    thumb: 'img/thumb/6.jpg',
    image: 'img/6.jpg',
    price: 1.99,
    photographer: 'Bob',
    tag: 'myTag',
    description: 'Vidit'
}, {
    id: '7',
    title: 'Cappuccino',
    thumb: 'img/thumb/7.jpg',
    image: 'img/7.jpg',
    price: 2.99,
    photographer: 'Gino',
    tag: 'myTag',
    description: 'Et'
}, {
    id: '8',
    title: 'Pier',
    thumb: 'img/thumb/8.jpg',
    image: 'img/8.jpg',
    price: 3.99,
    photographer: 'Michele',
    tag: 'myTag',
    description: 'Vidit'
}, {
    id: '9',
    title: 'Fog',
    thumb: 'img/thumb/9.jpg',
    image: 'img/9.jpg',
    price: 1.40,
    photographer: 'Bob',
    tag: 'myTag',
    description: 'Causae'
}, {
    id: '10',
    title: 'Bear',
    thumb: 'img/thumb/10.jpg',
    image: 'img/10.jpg',
    price: 9.99,
    photographer: 'Ettore',
    tag: 'myTag',
    description: 'Cu '
}, {
    id: '11',
    title: 'Houses',
    thumb: 'img/thumb/11.jpg',
    image: 'img/11.jpg',
    price: 3.78,
    photographer: 'Gino',
    tag: 'myTag',
    description: 'Has'
}, {
    id: '12',
    title: 'Skyline',
    thumb: 'img/thumb/12.jpg',
    image: 'img/12.jpg',
    price: 1.99,
    photographer: 'Paolo',
    tag: 'myTag',
    description: ''
}, {
    id: '13',
    title: 'X100S',
    thumb: 'img/thumb/13.jpg',
    image: 'img/13.jpg',
    price: 2.99,
    photographer: 'Gino',
    tag: 'myTag',
    description: 'Et'
}, {
    id: '14',
    title: 'Trains',
    thumb: 'img/thumb/14.jpg',
    image: 'img/14.jpg',
    price: 3.99,
    photographer: 'paolo',
    tag: 'myTag',
    description: 'Vidit'
}, {
    id: '15',
    title: 'Library',
    thumb: 'img/thumb/15.jpg',
    image: 'img/15.jpg',
    price: 1.40,
    photographer: 'Michele',
    tag: 'myTag',
    description: ''
}, {
    id: '16',
    title: 'Rock\'nRoll',
    thumb: 'img/thumb/16.jpg',
    image: 'img/16.jpg',
    price: 0.78,
    photographer: 'Ettore',
    tag: 'myTag',
    description: 'Cu '
}, {
    id: '17',
    title: 'Palm\'s Beach',
    thumb: 'img/thumb/17.jpg',
    image: 'img/17.jpg',
    price: 7.90,
    photographer: 'Gino',
    tag: 'myTag',
    description: 'Has.'
}

];

我想更改格式，并且有一个项目有多个价格（根据打印尺寸）我一直试图玩代码，但我无法弄清楚如何为多个价格一件事。

这是完整的Javascript代码 - http://pastebin.com/62PJFf8M

在我的HTML中：我有这个 - 所以每张照片都有几个价格选项。但问题是每张照片的按钮现在都有相同的ID ..

  <div class="infos">
        <h4 class="name text-info"><%= title %></h4>
        <button id="addCart" class="btn btn-danger btn-sm"><i class="fa fa-shopping-cart"></i> Hi Res </button>
        <button id="addCart" class="btn btn-danger btn-sm"><i class="fa fa-shopping-cart"></i> 10 x 15</button>
        <button id="addCart" class="btn btn-danger btn-sm"><i class="fa fa-shopping-cart"></i> 13 x 18</button>
        <button id="addCart" class="btn btn-danger btn-sm"><i class="fa fa-shopping-cart"></i> A4</button>
        <button id="addCart" class="btn btn-danger btn-sm"><i class="fa fa-shopping-cart"></i> A3</button>

    </div>

Answer 1

您可以使用一系列价格，例如此处的最后一项。

var items = [{
    id: '14',
    title: 'Trains',
    thumb: 'img/thumb/14.jpg',
    image: 'img/14.jpg',
    price: 3.99,
    photographer: 'paolo',
    tag: 'myTag',
    description: 'Vidit'
}, {
    id: '15',
    title: 'Library',
    thumb: 'img/thumb/15.jpg',
    image: 'img/15.jpg',
    price: 1.40,
    photographer: 'Michele',
    tag: 'myTag',
    description: ''
}, {
    id: '16',
    title: 'Rock\'nRoll',
    thumb: 'img/thumb/16.jpg',
    image: 'img/16.jpg',
    price: 0.78,
    photographer: 'Ettore',
    tag: 'myTag',
    description: 'Cu '
}, {
    id: '17',
    title: 'Palm\'s Beach',
    thumb: 'img/thumb/17.jpg',
    image: 'img/17.jpg',
    price: [7.90, 1, 2, 3],
    photographer: 'Gino',
    tag: 'myTag',
    description: 'Has.'
}

];



for (var i of items)
{
  console.log(i.id)
  console.log(i.price)
}

Answer 2

您可以通过循环浏览项目对象来添加新价格，如下所示：

for(var i = 0; i < items.length; i++){
    items[i].newprice = 10.00;
}

向对象添加newprice属性与object.newproperty =

一样简单

Fiddle

Javascript - 响应式商店;多个项目 - 每个项目具有不同的价格值

2 个答案: