ajax paypal购物车

ajax paypal购物车

 

演示

 

 

XML/HTML Code

<div class="product_list">
       <div class="product_list_header">Demo Store <div class="sub"></div><div id="cart">Cart</div></div>
       <div id="product_list" class="product_list_content">
           <div class="product">
               <div class="thumbnail"><img src="media/macbook.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">MacBook</div><div class="sub">(shipping $20)</div></div><div class="button" id="macbook">buy $999</div></div>
           </div>
           <div class="product">
               <div class="thumbnail"><img src="media/macbookair.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">MacBook Air</div><div class="sub">(shipping $20)</div></div><div class="button" id="macbookair">buy $999</div></div>
           </div>
           <div class="product">
               <div class="thumbnail"><img src="media/macbookpro.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">MacBook Pro</div><div class="sub">(free shipping)</div></div><div class="button" id="macbookpro">buy $1199</div></div>
           </div>
           <div class="product">
               <div class="thumbnail"><img src="media/macosx.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">Mac OS X</div><div class="sub">(Purchase once|Download)</div></div><div class="button" id="macosx">buy $99</div></div>
           </div>
           <div class="product">
               <div class="thumbnail"><img src="media/imac.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">iMac</div><div class="sub">(free shipping)</div></div><div class="button" id="imac">buy $1199</div></div>
           </div>
           <div class="product">
               <div class="thumbnail"><img src="media/macmini.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">Mac Mini</div><div class="sub">(shipping $20)</div></div><div class="button" id="macmini">buy $699</div></div>
           </div>
           <div class="product">
               <div class="thumbnail"><img src="media/macpro.jpg"/></div>
               <div class="caption"><div class="text"><div class="main">Mac Pro</div><div class="sub">(free shipping)</div></div><div class="button" id="macpro">buy $2499</div></div>
           </div>
       </div>

 

JavaScript Code

<script type="text/javascript">
        $(function(){

            // Create a new AJAXPaypalCart Object
            var cart = $('#cart').DCAJAXPaypalCart({
                width:600,
                autoOpenWhenAdd:true,
                openNewCheckOutWindow:true,
                //themeColor:'#333',
                //themeDarkColor:'#FFF',
                header:'AJAX Cart Demo',
                footer:'We accpet paypal, visa and master card. (This is a customizable footer)',
                paypalOptions:{
                    business:'@',
                    page_style:'digicrafts'
                }
            });

            // Add the button
            cart.addBuyButton("#macbook",{
                name:'MacBook',                     // Item name appear on the cart
                thumbnail:'media/macbook.jpg',      // Thumbnail path of the item (Optional)
                price:'999',                        // Cost of the item
                shipping:20                         // Shipping cost for the item (Optional)
            });
            cart.addBuyButton("#macbookair",{
                name:'MacBook Air',
                thumbnail:'media/macbook.jpg',
                price:'999',
                shipping:20
            });
            cart.addBuyButton("#macbookpro",{
                name:'MacBook Pro',
                thumbnail:'media/macbookpro.jpg',
                price:'1199',
                shipping:0
            });
            cart.addBuyButton("#imac",{
                name:'iMac',
                thumbnail:'media/macbook.jpg',
                price:'1199',
                shipping:0
            });
            cart.addBuyButton("#macmini",{
                name:'Mac Mini',
                thumbnail:'media/macbookpro.jpg',
                price:'699',
                shipping:20
            });
            cart.addBuyButton("#macpro",{
                name:'Mac pro',
                thumbnail:'media/macpro.jpg',
                price:'2499'
            });
            cart.addBuyButton("#macosx",{
                name:'Mac OS X',
                thumbnail:'media/macosx.jpg',
                price:'99',
                allowMultiple:false
            });

            // For code highlight
            prettyPrint();

        });
    </script>

 

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