随便整理了个小案例，有错误也可以指点出来，后期可以改正
补充一下 formatNum（）先前的这个方法算出来的结果有问题，重新调整成以下代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
* {
padding: 0;
margin: 0;
}
li {
list-style: none;
}
#co-shipping-method-form {
margin: auto;
width: 400px;
border: 1px solid #DDDDDD;
margin-bottom: 40px;
padding: 20px;
}
</style>
</head>
<body>
<form id="co-shipping-method-form" action="">
<dl class="sp-methods"><dt>FedEx</dt>
<dd>
<ul>
<li>
<input name="estimate_method" type="radio" value="zentech_shippingfedex_fedex" id="s_method_zentech_shippingfedex_fedex" class="radio">
<label for="s_method_zentech_shippingfedex_fedex" id="price22">
Express (3-7 days)
<span class="price" id="">$108,888.17</span>
</label>
</li>
</ul>
</dd><dt>EMS</dt>
<dd>
<ul>
<li><input name="estimate_method" type="radio" value="zentech_shippingems_ems" id="s_method_zentech_shippingems_ems" class="radio"><label for="s_method_zentech_shippingems_ems" id="price22">(5-11 days) <span class="price">$86.81</span></label></li>
</ul>
</dd><dt>DHL</dt>
<dd>
<ul>
<li><input name="estimate_method" type="radio" value="zentech_shippingdhl_dhl" id="s_method_zentech_shippingdhl_dhl" class="radio"><label for="s_method_zentech_shippingdhl_dhl" id="price22">Express (3-7 days) <span class="price">$103.88</span></label></li>
</ul>
</dd><dt>Australia Post</dt>
<dd>
<ul>
<li><input name="estimate_method" type="radio" value="zentech_shippingauspost_airparcel" id="s_method_zentech_shippingauspost_airparcel" checked="checked" class="radio"><label for="s_method_zentech_shippingauspost_airparcel" id="price22">Air Parcel (5-8 business days) <span class="price">$61.03</span></label></li>
<li><input name="estimate_method" type="radio" value="zentech_shippingauspost_airpacket" id="s_method_zentech_shippingauspost_airpacket" class="radio"><label for="s_method_zentech_shippingauspost_airpacket" id="price22">Air Packet (7-15 business days) No Tracking <span class="price">$87.01</span></label></li>
</ul>
</dd><dt>Table Rates (system)</dt>
<dd>
<ul>
<li id="price22"><input name="estimate_method" type="radio" value="tablerate_bestway" id="s_method_tablerate_bestway" class="radio"><label for="s_method_tablerate_bestway">regular_old <span class="price">$64.34</span></label></li>
</ul>
</dd>
</dl>
<div class="buttons-set"><button type="submit" title="Update Total" class="button" name="do" value="Update Total"><span><span>Update Total</span></span></button></div>
</form>
<!--求总和-->
<div class="totals" style="width: 400px;margin: auto;border: 1px solid #DDDDDD;padding: 20px;">
<table id="shopping-cart-totals-table">
<colgroup>
<col>
<col width="1">
</colgroup>
<tfoot>
<tr>
<td style="" class="a-right" colspan="1"><strong>Grand Total</strong></td>
<td style="" class="a-right"><strong><span class="price">$164.97</span></strong></td>
</tr>
</tfoot>
<tbody>
<tr>
<td style="" class="a-right" colspan="1">Subtotal </td>
<td style="" class="a-right"><span class="price">$103.94</span></td>
</tr>
<tr>
<td style="" class="a-right" colspan="1">Shipping & Handling </td>
<td style="" class="a-right"><span class="price" id="price1">$61.03</span></td>
</tr>
</tbody>
</table>
<ul class="checkout-types">
<li><button type="button" title="Proceed to Checkout" class="button btn-proceed-checkout btn-checkout" οnclick="window.location='';"><span><span>Proceed to Checkout</span></span></button></li>
</ul>
</div>
<script src="js/jquery-3.2.1.min.js"></script>
<script>
$(function(){
$("#co-shipping-method-form input").click(function() {
//获取到选中的radio txt
var shipping_label = $(this).next();
var shipping_span_txt = $(shipping_label).children("span").text().split("$")[1];
console.log(shipping_span_txt);
//Subtotal
var shipping_subtotal_txt = $("#shopping-cart-totals-table tbody tr:eq(0) td:eq(1) span").text().split("$")[1];
//Shipping & Handling
$("#shopping-cart-totals-table tbody tr:eq(1) td:eq(1) span").text("$" + shipping_span_txt);
//Grand Total
var total_price = new Number(shipping_subtotal_txt.replace(",","")) + new Number(shipping_span_txt.replace(",",""));
$("#shopping-cart-totals-table tfoot tr:eq(0) td:eq(1) span").text("$" + total_price.formatMoney(2));
}
)
Number.prototype.formatMoney = function(c, d, t){
var n = this,
c = isNaN(c = Math.abs(c)) ? 2 : c,
d = d == undefined ? "." : d,
t = t == undefined ? "," : t,
s = n < 0 ? "-" : "",
i = String(parseInt(n = Math.abs(Number(n) || 0).toFixed(c))),
j = (j = i.length) > 3 ? j % 3 : 0;
return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
};
})
</script>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
