jQuery实现购物车物品数量的加减
基于jquery的一款代码，实现购物车数据的加减，在淘宝网、京东商城购物时时经常见到的一个功能，点击文本框两侧的“+”与“-”，就可以增加或减少文本框内的数字值，每次步长为1，当然这个是可以自己设置的。本款效果除了加减功能外，还可以自动计算价格。
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>jQuery实现购物车物品数量的加减</title> 6 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 7 <script> 8 $(function(){ 9 var t = $("#text_box"); 10 $("#add").click(function(){ 11 t.val(parseInt(t.val())+1) 12 setTotal(); 13 }) 14 $("#min").click(function(){ 15 t.val(parseInt(t.val())-1) 16 setTotal(); 17 }) 18 function setTotal(){ 19 $("#total").html((parseInt(t.val())*3.95).toFixed(2)); 20 } 21 setTotal(); 22 }) 23 </script> 24 </head> 25 <body> 26 <p>单价：3.95</p> 27 <input id="min" name="" type="button" value="-" /> 28 <input id="text_box" name="" type="text" value="4" /> 29 <input id="add" name="" type="button" value="+" /> 30 <p>总价：<label id="total"></label></p> 31 </body> 32 </html>
