jquery无刷新购物车 点击加入产品到购物车

jquery无刷新购物车 点击加入产品到购物车

 

演示

 

 

XML/HTML Code

1. <div align="left">  
2.       
3.     <div id="wrap" align="left">  
4.           
5.         <ul>  
6.             <li id="1">  
7.                 <img src="a1.png" class="items" height="100" alt="" />  
8.                   
9.                 <br clear="all" />  
10.                 <div><span class="name">Mac/OS X: Price</span>: $<span class="price">800</span> </div>  
11.             </li>  
12.             <li id="2">  
13.                 <img src="5.png" class="items" height="100" alt="" />  
14.                   
15.                 <br clear="all" />  
16.                 <div><span class="name">IPhone 3GS </span>: $<span class="price">500 </span></div>  
17.             </li>  
18.             <li id="3">  
19.                 <img src="1.png" class="items" height="100" alt="" />  
20.                   
21.                 <br clear="all" />  
22.                 <div><span class="name">Apple IPad </span>: $<span class="price">450</span></div>  
23.             </li>  
24.               
25.             <li id="4">  
26.                 <img src="6.png" class="items" height="100" alt="" />  
27.                   
28.                 <br clear="all" />  
29.                 <div><span class="name">Mac NoteBook </span>: $<span class="price">1200 </span></div>  
30.             </li>  
31.             <li id="5">  
32.                 <img src="7.png" class="items" height="100" alt="" />  
33.                   
34.                 <br clear="all" />  
35.                 <div> <span class="name">Bag : Buy Now Price </span>: $<span class="price">65</span></div>  
36.             </li>  
37.               
38.             <li id="6">  
39.                 <img src="5.png" class="items" height="100" alt="" />  
40.                   
41.                 <br clear="all" />  
42.                 <div><span class="name">IPhone 4GS </span>: $<span class="price">800</span> </div>  
43.             </li>  
44.               
45.             <li id="7">  
46.                 <img src="7.png" class="items" height="100" alt="" />  
47.                   
48.                 <br clear="all" />  
49.                 <div><span class="name"> Bag : Buy Now Price </span>: $<span class="price">45</span></div>  
50.             </li>  
51.             <li id="8">  
52.                 <img src="6.png" class="items" height="100" alt="" />  
53.                   
54.                 <br clear="all" />  
55.                 <div><span class="name">Mac NoteBook </span>: $<span class="price">900 </span></div>  
56.             </li>  
57.               
58.             <li id="9">  
59.                 <img src="8.png" class="items" height="100" alt="" />  
60.                   
61.                 <br clear="all" />  
62.                 <div><span class="name">Sony Super Ear Phone </span>: $<span class="price">20</span></div>  
63.             </li>  
64.               
65.         </ul>  
66.           
67.         <br clear="all" />  
68.           
69.         <div id="bottomBar" align="left"><img src="carts.png" id="cart" /></div>  
70.       
71.     </div>  
72.       
73.     <div id="left_bar">   
74.           
75.         <form action="#" id="cart_form" name="cart_form">  
76.           
77.         <div class="cart-info"></div>  
78.           
79.         <div class="cart-total">  
80.           
81.             <b>Total Charges:          </b> $<span>0</span>  
82.               
83.             <input type="hidden" name="total-hidden-charges" id="total-hidden-charges" value="0" />  
84.         </div>  
85.           
86.         <button type="submit" id="Submit">CheckOut</button>  
87.           
88.         </form>  
89.           
90.     </div>   
91.           
92.           
93.       
94. </div>  

 

原文地址:http://www.freejs.net/article_jquerywenzi_287.html