jQuery實現購物車物品數量的加減（減到1時不能減少）
阿新 • • 發佈：2019-02-11
這是我從網上找的一篇實現購物車物品數量的加減，自己做了一個改動，最小值為1，當最小值為1時再按減少，減少按鈕不可編輯，當按增加數量時恢復減少按鈕狀態。這個除了加減功能外，也可以自動計算價格。
本文章改動前來源：http://blog.csdn.net/dongsg11200/article/details/8762495<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jQuery實現購物車物品數量的加減</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script> $(function(){ var t = $("#quantity"); $("#add").click(function(){ t.val(parseInt(t.val())+1); $("#min").removeAttr("disabled"); //當按加1時，解除$("#min")不可讀狀態 setTotal(); }) $("#min").click(function(){ if (parseInt(t.val())>1) { //判斷數量值大於1時才可以減少 t.val(parseInt(t.val())-1) }else{ $("#min").attr("disabled","disabled") //當$("#min")為1時，$("#min")不可讀狀態 } setTotal(); }) function setTotal(){ $("#total").html((parseInt(t.val())*3.95).toFixed(2)); } setTotal(); }) </script> </head> <body> <p>單價：1.23</p> <input id="min" name="" type="button" value="-" /> <input id="quantity" name="" type="text" value="1" /> <input id="add" name="" type="button" value="+" /> <p>總價：<label id="total"></label></p> </body> </html>