How to use JavaScript to realize simple Shopping Mini form

Editor to share with you how to use JavaScript to achieve a simple shopping form, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

The details are as follows

Html Code:

Commodity price apple 8000 banana 5000 pear 2000 vegetables 2000 total price is: 0 yuan

JQ Code:

$(function () {$(".all") .change (function () {var value=$ (this) .prop ("checked") $(".lla"). Prop ("checked", value) zongjia ()}) $(".lla") .click (function () {var chang1=$ (".lla"). Length; var chang2=$ (".lla: checked"). Length If (chang1===chang2) {$(".all") .prop ("checked", true)} else {$(".all") .prop ("checked", false)} zongjia ()) $(".lla") .change (function () {zongjia ()}) function zongjia () {var xuan=$ (".lla: checked") .parents (".zuida"); var num=0 Xuan.each (function (index,rom) {var xuanzhi=$ (rom) .find (".zongji") .text () * 1; num+=xuanzhi;}) $(".zongjia") .text (num);}})

Finished product drawing:

The above is all the contents of the article "how to use JavaScript to achieve a simple shopping mini-form". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!