1

我正在使用一个系统，该系统在几乎没有自定义空间的表格中生成购物车摘要。我想做的是当购物车为“空”时显示“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");
}

一些额外的值得注意的：

  1. 能够拥有 0 个“项目”、1 个“项目”、2 个“项目”会很棒。而不是总是“项目”
  2. 在另一个跨度中单独显示总成本也很棒。也许.cartAmount。
4

1 回答 1

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变量中不获取任何 html
  • 使用正则表达式解析出项目数而不是拆分
于 2012-05-18T01:58:45.153 回答