Question

我使用的系统在表格中生成购物车摘要，几乎没有自定义空间。我想做的是当购物车“空”显示“0”

时

如果有数量，请显示该数字。

这是我生成的HTML 隐藏：

<span vertical="False" quote="False" id="catCartSummary">
   <table cellspacing="0" class="cartSummaryTable">
     <tbody>
       <tr>
         <td class="cartSummaryItem">3 item(s), Total: $115.00 <a href="/OrderRetrievev2.aspx?CatalogueID=0" class="cartSummaryLink">View Cart</a></td>
       </tr>
     </tbody>
   </table>
</span>

如您所见，它目前有“3个项目”。

这看起来像是空的：

<span vertical="False" quote="False" id="catCartSummary">
   <table cellspacing="0" class="cartSummaryTable">
     <tbody>
       <tr>
         <td class="cartSummaryItem">Shopping cart is empty.</td>
       </tr>
     </tbody>
   </table>
</span>

现在我在这里设置了一些简单的HTML：

<div class="cartsummary">
  <div class="cartitems">Shopping Cart <a href="#"><span class="cartTotal"></span> Item(s)</a></div>
</div>

使用jQuery我想接受数量并将其添加到.cartTotal，如果购物车中没有任何内容，只显示0。

这种方法有效，但是如果我向购物车添加新商品，它只会在刷新页面时更新值，而自动生成的动态更新。

if (jQuery('#catCartSummary .cartSummaryItem').html() != 'Shopping cart is empty.') {
   var summary = jQuery('#catCartSummary .cartSummaryItem').text().split(" ");
   var total = summary[0];
   jQuery('span.cartTotal').html(total);
}else{
   jQuery('span.cartTotal').html("0");
}

值得注意的是：

能够拥有0个“项目”，1个“项目”，2个“项目”会很棒。而不是总是“Item（s）”
在另一个范围内单独显示总成本也很棒。也许.cartAmount。

Answer 1

尝试：

var text = $('#catCartSummary .cartSummaryItem').text();
items = text.match(/(\d+) item/);
var num = 0;
if(items &&items.length > 0){
   num = items[1];
}
$(".cartItems").html('<div class="cartitems">Shopping Cart <a href="#"><span class="cartTotal">'+num+'</span> Item'+(num == 1 ? '' : 's') +'</a></div>');

一些指示：

使用.text（）来获取text变量
使用正则表达式解析项目数而不是拆分

如何动态克隆元素中的文本？

1 个答案: