外贸网站响应式,内销网站要怎么做,成功的门户网站,深圳app开发网站建设当我们添加购物车之后#xff0c;我们可以点击加减按钮来实现商品数量的增加和减少#xff0c;当商品数量变化的同时商品的总的价格也是在不停的变化的。
效果图 完整代码
!DOCTYPE html
html langenheadmeta charsetUTF-8我们可以点击加减按钮来实现商品数量的增加和减少当商品数量变化的同时商品的总的价格也是在不停的变化的。
效果图 完整代码
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0meta http-equivX-UA-Compatible contentieedgetitle/titlescript srchttps://code.jquery.com/jquery-3.4.1.min.js/script/headbodyp商品数量: span onclicknumDec()-/span input typetext idquantity value1 / span onclicknumAdd()/span/pp classsdsd商品价格: span idtotalPrice28.10/span/pinput typehidden value28.1 idprice //bodyscript typetext/javascriptfunction keyup(){var quantity document.getElementById(quantity).value;if(isNaN(quantity) || parseInt(quantity)!quantity || parseInt(quantity)1){quantity 1;return;}if(quantity10){document.getElementById(quantity).valuequantity.substring(0,quantity.length-1);alert(商品数量不能大于10);}} function numAdd(){var quantity document.getElementById(quantity).value;var num_add parseInt(quantity)1;var pricedocument.getElementById(price).value;if(quantity){num_add 1;}if(num_add10){document.getElementById(quantity).valuenum_add-1;alert(商品数量不能大于10);}else{document.getElementById(quantity).valuenum_add;var Numprice*num_add;document.getElementById(totalPrice).innerHTMLNum.toFixed(2);}}/*商品数量-1*/function numDec(){var quantity document.getElementById(quantity).value;var pricedocument.getElementById(price).value;var num_dec parseInt(quantity)-1;if(num_dec0){document.getElementById(quantity).valuenum_dec;var Numprice*num_dec;document.getElementById(totalPrice).innerHTMLNum.toFixed(2);}}/script /html