0

我正在使用 simplecart js。我无法让产品图像的图像源与购物车中的产品信息一起出现。

图片来源未定义，见demo http://jsfiddle.net/z7xW4/15/

我使用以下代码创建列

<div class="simpleCart_shelfItem">

<img alt="image" src="http://placehold.it/100x100" class="item-image"/>
<a href="javascript:;" class="item_add">Add to Cart</a>

大车

  simpleCart({
checkout: {
  type: "PayPal",
  email: "you@yours.com"
},
cartColumns: [
    
    {view:'image' , attr:'thumb', label: false},
    { attr: "price" , label: "Price", view: 'currency' } ,
    
    { attr: "quantity" , label: "Qty" } ,
    
    { attr: "total" , label: "SubTotal", view: 'currency' } ,
    { view: "remove" , text: "Remove" , label: false }
],
cartStyle: "table"
});
4

2 回答 2

3

通过使用此代码解决

{ view: function(item, column){
      return"<img src='"+item.get('image')+"'>";
   },
  attr: 'image' },

见演示http://jsfiddle.net/z7xW4/23/

于 2014-04-07T19:58:32.983 回答
2

基于您的答案并四处挖掘，我发现了这个解决方案，它使用 javascript simpleCart.add() 函数而不是用于定义项目的 html 配置。这适用于 simpleCart v3（使用 v3.0.5 测试）。

simpleCart 配置是相同的（我使用拇指作为我的图像字段）：

simpleCart({
    checkout: {
        type: "PayPal",
        email: "you@yours.com" },
    cartColumns: [
        {view : function(item, column){
            return "<img src='" + item.get('thumb') + "'>";},
            attr : 'thumb'},
        { attr: "price" , label: "Price", view: 'currency' } ,
        { attr: "quantity" , label: "Qty" } ,
        { attr: "total" , label: "SubTotal", view: 'currency' } ,
        { view: "remove" , text: "Remove" , label: false }   ],
    cartStyle: "table"
 });

这是不同的部分，因为它使用了我更喜欢的 simpleCart add 函数，并且在其他任何地方都找不到示例：

 <li><img class="productimage" src="myproductimage.png" alt"myproductname" />
 <span class="price">$10</span><b>MyProductName<br />
 <a href="#" onclick="simpleCart.add({quantity:1,name:'myproductname',price:'10.00',thumb:'myproductimage.png'});return false;">add to cart</a></b></li>
于 2014-05-07T12:59:29.280 回答