1 <!DOCTYPE HTML>2 <HTML>3 <Head>4 <Metahttp-equiv= "Content-type"content= "textml; charset=utf-8">5 <Metaname= "Viewport"content= "Width=device-width">6 <Metaname= "Viewport"content= "Width=device-width, initial-scale=1, maximum-scale=1, User-scalable=no">7 <title>jquery enables the addition and subtraction of multiple items in a shopping cart + Total Price calculation</title>8 <Scripttype= "Text/javascript"src= "Http://code.jquery.com/jquery-1.6.1.min.js"></Script>9 </Head>Ten <Script> One $(function(){ A $(". Add"). Click (function(){ - varT=$( This). Parent (). Find ('Input[class*=text_box]'); - T.val (parseint (T.val ())+1) the settotal (); - }) - $(". Min"). Click (function(){ - varT=$( This). Parent (). Find ('Input[class*=text_box]'); + T.val (parseint (T.val ())-1) - if(parseint (T.val ())<0){ + T.val (0); A } at settotal (); - }) - functionsettotal () { - vars=0; - $("#tab TD"). each (function(){ - s+=parseint ($ ( This). Find ('Input[class*=text_box]'). Val ())*parsefloat ($ ( This). Find ('Span[class*=price]'). text ()); in }); - $("#total"). HTML (s.tofixed (2)); to } + settotal (); - the }) * </Script> $ <Body>Panax Notoginseng <TableID= "tab"> - <TR> the <TD> + <span>Price:</span><spanclass= "Price">1.50</span> A <inputclass= "min"name=""type= "button"value="-" /> the <inputclass= "Text_box"name=""type= "text"value= "1" /> + <inputclass= "Add"name=""type= "button"value="+" /> - </TD> $ </TR> $ <TR> - <TD> - <span>Price:</span><spanclass= "Price">3.95</span> the <inputclass= "min"name=""type= "button"value="-" /> - <inputclass= "Text_box"name=""type= "text"value= "1" />Wuyi <inputclass= "Add"name=""type= "button"value="+" /> the </TD> - </TR> Wu </Table> - About <P>Price:<labelID= "Total"></label></P> $ </Body> - </HTML>
jquery enables the addition and subtraction of multiple items in a shopping cart + Total Price calculation