<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div class="zaocan_2_2"> <div class="card"> <p class="p1">流油包子</p> <p class="p4 zao_1"><span class="zaocan_price">5.00</span>/份</p> <div class="zaocan_2_1"> <input class="min" name="" type="button" value="-" /> <input class="text_box" name="" type="text" value="0" /> <input class="add" name="" type="button" value="+" /> </div> </div> </div> <div class="zaocan_2_2"> <div class="card"> <p class="p1">小米粥</p> <p class="p4 zao_1"><span class="zaocan_price">2.00</span>/份</p> <div class="zaocan_2_1"> <input class="min" name="" type="button" value="-" /> <input class="text_box" name="" type="text" value="0" /> <input class="add" name="" type="button" value="+" /> </div> </div> </div> <p class="zaocan_13">¥: <label id="total"></label> </p> <script src="jquery.js"></script> <script> $(function() { $(".add").click(function() { var t = $(this).parent().find('input[class*=text_box]'); t.val(parseInt(t.val()) + 1) setTotal(); }) $(".min").click(function() { var t = $(this).parent().find('input[class*=text_box]'); t.val(parseInt(t.val()) - 1) if (parseInt(t.val()) < 0) { t.val(0); } setTotal(); }) function setTotal() { var s = 0; $(".zaocan_2_2").each(function() { s += parseInt($(this).find('input[class*=text_box]').val()) * parseFloat($(this).find('span[class*=zaocan_price]').text()); }); $("#total").html(s.toFixed(2)); } setTotal(); }) </script> </body> </html>