Paypal按钮和jquery结账

Paypal button and checkout with jquery

本文关键字：结账 jquery 按钮 Paypal      更新时间：2023-09-26

我有这个代码：

<script>
    /* Set rates + misc */
var taxRate = 0.08;
var shippingRate = 0.00; 
var fadeTime = 300;
/* Assign actions */
$('.product-quantity input').change( function() {
  updateQuantity(this);
});
$('.product-removal button').click( function() {
  removeItem(this);
});
/* Recalculate cart */
function recalculateCart()
{
  var subtotal = 0;
  
  /* Sum up row totals */
  $('.product').each(function () {
    subtotal += parseFloat($(this).children('.product-line-price').text());
  });
  
  /* Calculate totals */
  var tax = subtotal * taxRate;
  var shipping = (subtotal > 0 ? shippingRate : 0);
  var total = subtotal + tax + shipping;
  
  /* Update totals display */
  $('.totals-value').fadeOut(fadeTime, function() {
    $('#cart-subtotal').html(subtotal.toFixed(2));
    $('#cart-tax').html(tax.toFixed(2));
    $('#cart-shipping').html(shipping.toFixed(2));
    $('#cart-total').html(total.toFixed(2));
    if(total == 0){
      $('.checkout').fadeOut(fadeTime);
    }else{
      $('.checkout').fadeIn(fadeTime);
    }
    $('.totals-value').fadeIn(fadeTime);
  });
}
/* Update quantity */
function updateQuantity(quantityInput)
{
  /* Calculate line price */
  var productRow = $(quantityInput).parent().parent();
  var price = parseFloat(productRow.children('.product-price').text());
  var quantity = $(quantityInput).val();
  var linePrice = price * quantity;
  
  /* Update line price display and recalc cart totals */
  productRow.children('.product-line-price').each(function () {
    $(this).fadeOut(fadeTime, function() {
      $(this).text(linePrice.toFixed(2));
      recalculateCart();
      $(this).fadeIn(fadeTime);
    });
  });  
}
/* Remove item from cart */
function removeItem(removeButton)
{
  /* Remove row from DOM and recalc cart total */
  var productRow = $(removeButton).parent().parent();
  productRow.slideUp(fadeTime, function() {
    productRow.remove();
    recalculateCart();
  });
}
    //@ sourceURL=pen.js
  </script>

完整的演示可以在这里观看：http://codepen.io/justinklemm/pen/zAdoJ

？因为我可以用jquery结账按钮通过贝宝支付？

示例。

支付总额：$90.57与贝宝

我的代码按钮贝宝：

 <input class="checkout" type="image" src="https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif" border="0" name="submit" style="vertical-align:middle" alt="PayPal">

谢谢。

也许这会有所帮助，试着玩一玩。

<SCRIPT TYPE="text/javascript">
function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
function Dollar (val) {  // force to valid dollar amount
var str,pos,rnd=0;
  if (val < .995) rnd = 1;  // for old Netscape browsers
  str = escape (val*1.0 + 0.005001 + rnd);  // float, round, escape
  pos = str.indexOf (".");
  if (pos > 0) str = str.substring (rnd, pos + 3);
  return str;
}
function ReadForm (obj1) { // process un-named selects
var i,j,amt,des,obj,pos,tok,val;
var ary = new Array ();
  amt = obj1.baseamt.value*1.0;       // base amount
  des = obj1.basedes.value;           // base description
  for (i=0; i<obj1.length; i++) {     // run entire form
    obj = obj1.elements[i];           // a form element
    if (obj.type == "select-one" &&   // just get selects
        obj.name == "") {             // must be un-named
      pos = obj.selectedIndex;        // which option selected
      val = obj.options[pos].value;   // selected value
      ary = val.split (" ");          // break apart
      for (j=0; j<ary.length; j++) {  // look at all items
// first we do single character tokens...
        if (ary[j].length < 2) continue;
        tok = ary[j].substring (0,1); // first character
        val = ary[j].substring (1);   // get data
        if (tok == "@") amt = val * 1.0;
        if (tok == "+") amt = amt + val*1.0;
        if (tok == "%") amt = amt + (amt * val/100.0);
        if (tok == "#") {             // record item number
          if (obj1.item_number) obj1.item_number.value = val;
          ary[j] = "";                // zap this array element
        }
// Now we do 3-character tokens...
        if (ary[j].length < 4) continue;
        tok = ary[j].substring (0,3); // first 3 chars
        val = ary[j].substring (3);   // get data
        if (tok == "s1=") {           // value for shipping
          if (obj1.shipping)  obj1.shipping.value  = val;
          ary[j] = "";                // clear it out
        }
        if (tok == "s2=") {           // value for shipping2
          if (obj1.shipping2) obj1.shipping2.value = val;
          ary[j] = "";                // clear it out
        }
      }
      val = ary.join (" ");           // rebuild val with what's left
      if (des.length == 0) des = val; // 1st storage?
      else des = des + ", " + val;    // nope, accumulate value
    }
  }
  obj1.item_name.value = des;
  obj1.amount.value = Dollar (amt);
  if (obj1.tot) obj1.tot.value = "$" + Dollar (amt);
}
</SCRIPT>
<FORM id=viewcart name=viewcart action=https://www.paypal.com/cgi-bin/webscr 
method=post>
          </FORM>
          <FORM onSubmit="this.target = 'paypal';&#10;     ReadForm (this.form);" 
action=https://www.paypal.com/cgi-bin/webscr method=post>
            <P> 
              <INPUT type=hidden value=_cart name=cmd>
              <INPUT type=hidden value=1 name=add>
              <INPUT type=hidden value=my@email.com name=business>    
              <INPUT type=hidden name=item_name>
              <INPUT type=hidden name=item_number>
              <INPUT type=hidden name=amount>
              <INPUT type=hidden value=USD name=currency_code>    
              <INPUT type=hidden value=USD name=lc>   
              <INPUT type=hidden value=00 name=shipping>
              <INPUT type=hidden value=00.00 name=baseamt>
              <INPUT type=hidden VALUE="itemname" name=basedes>     
              <INPUT TYPE="hidden" NAME="on0" VALUE="Details">        
              <INPUT TYPE="hidden" NAME="os0" VALUE="moredetails" MAXLENGTH="800">   
            <BR>
            <BR>
            </P>
            <TABLE WIDTH="400px" BORDER="0" CELLPADDING="0" CELLSPACING="0" align="right">
              <TR> 
                <TD ALIGN="left">
                <p class="heading">&nbsp;</p>
                <p class="main">&nbsp;dropdown1</p>
                  <p class="heading">&nbsp;</p>
                </TD>
                <TD> 
                  <SELECT STYLE="WIDTH: 240px" onChange="ReadForm (this.form);">         
                     <OPTION selected>Please select </OPTION>
                    <OPTION VALUE="option1 +125.00">option1</OPTION>
                    <OPTION VALUE="option2 +90.00">option2</OPTION>
                    <OPTION VALUE="option3 +40.00">option3</OPTION>
                  </SELECT>
                </TD>
              </TR>
              <TR> 
                <TD ALIGN="left">
                <p class="heading">&nbsp;</p>
                <p class="main">&nbsp;dropdown2</p>
                <p class="heading">&nbsp;</p> 
                </TD>
                <TD> 
                  <SELECT STYLE="WIDTH: 240px" onChange="ReadForm (this.form);">
                    <OPTION selected>Please select </OPTION>
                    <OPTION VALUE="option1 +55.00">option1</OPTION>
                    <OPTION VALUE="option2 +99.00">option2</OPTION>
                    <OPTION VALUE="option3 +44.00">option3</OPTION>
                  </SELECT>
                </TD>
              </TR>  
              <tr>
               <TR> 
                <TD ALIGN="left">
                <p class="main">&nbsp;</p>
                <p class="main">&nbsp;Price</p>
                <p class="main">&nbsp;</p>
                </TD>
                <TD ALIGN="left"> 
                  <INPUT class=nbor size=8 value=00.00 name=tot>
                </TD>
              </TR>
              <TD align="left">
          <label for="submit"></label>
          <TD align="left">
           <input type="image" src="/addtocart2.png" name="submit" id="submit" value="submit" >
          </div>
        </div></td>
      </tr>
</table>
    </table>
  </form>
  </TABLE>
 </FORM>
</div>

相关文章：