我正在创建允许用户通过paypal支付金额的网络应用程序。我在按钮点击时使用模态样式。我放了三个按钮，每个按钮的金额不同。 但我偶然发现使用超过1个paypal结帐按钮。当我触发第一个按钮时，脚本运行3次，我该如何解决这个问题？或者这种事情无法做到？
这里是我的代码片段（3个paypal按钮）：
<div class="col-md-4 text-center">
<div class="portlet light bordered">
<div class="portlet-body">
<span style="font-size:18px; font-weight: bold">$10.00</span><br>
<p>Instantly Topup $10.00 into your balance.</p>
<div id="paypal-button1"></div>
</div>
</div>
</div>
<div class="col-md-4 text-center">
<div class="portlet light bordered">
<div class="portlet-body">
<span style="font-size:18px; font-weight: bold">$50.00</span><br>
<p>Instantly Topup $50.00 into your balance.</p>
<div id="paypal-button2"></div>
</div>
</div>
</div>
<div class="col-md-4 text-center">
<div class="portlet light bordered">
<div class="portlet-body">
<span style="font-size:18px; font-weight: bold">$100.00</span><br>
<p>Instantly Topup $100.00 into your balance.</p>
<div id="paypal-button3"></div>
</div>
</div>
</div>
这是我的paypal脚本：
paypal.Button.render({
env: 'sandbox', // Or 'sandbox',
client: {
sandbox: 'xxxxxxxxx',
production: 'xxxxxxxxx'
},
commit: true, // Show a 'Pay Now' button
payment: function(data, actions) {
return actions.payment.create({
transactions: [
{
amount: { total: '10.00', currency: 'SGD' }
}
]
});
},
onAuthorize: function(data, actions) {
// Execute the payment here
return actions.payment.execute().then(function(payment) {
// The payment is complete!
var userid = $("#login_user").attr("data-id");
var qty_1 = 10;
var alert = $('<div class="alert alert-success">You successfully top-up your credits</div>');
$("#paypal_info").before(alert);
$(".alert").delay(2000).fadeOut(1500, function() {
alert.remove();
$('#elementBalance').empty();
//update total balance
updateBalance(userid, qty_1);
//reload total credit now
loadBalance(userid);
//reload history
//$('#paypal_info').empty();
//loadMembers(login_user_id);
});
// You can now show a confirmation message to the customer
});
}
}, '#paypal-button1');
paypal.Button.render({
env: 'sandbox', // Or 'sandbox',
client: {
sandbox: 'xxxxxxxxx',
production: 'xxxxxxxxx'
},
commit: true, // Show a 'Pay Now' button
payment: function(data2, actions2) {
return actions.payment.create({
transactions: [
{
amount: { total: '50.00', currency: 'SGD' }
}
]
});
},
onAuthorize: function(data2, actions2) {
// Execute the payment here
return actions.payment.execute().then(function(payment) {
// The payment is complete!
var alert = $('<div class="alert alert-success">You successfully top-up your credits</div>');
$("#paypal_info").before(alert);
$(".alert").delay(2000).fadeOut(1500, function() {
alert.remove();
//reload total credit now
//$('#paypal_info').empty();
//loadMembers(login_user_id);
});
// You can now show a confirmation message to the customer
});
}
}, '#paypal-button2');
paypal.Button.render({
env: 'sandbox', // Or 'sandbox',
client: {
sandbox: 'xxxxxxxxx',
production: 'xxxxxxxxx'
},
commit: true, // Show a 'Pay Now' button
payment: function(data, actions) {
return actions.payment.create({
transactions: [
{
amount: { total: '100.00', currency: 'SGD' }
}
]
});
},
onAuthorize: function(data, actions) {
// Execute the payment here
return actions.payment.execute().then(function(payment) {
// The payment is complete!
var alert = $('<div class="alert alert-success">You successfully top-up your credits</div>');
$("#paypal_info").before(alert);
$(".alert").delay(2000).fadeOut(1500, function() {
alert.remove();
//reload total credit now
//$('#paypal_info').empty();
//loadMembers(login_user_id);
});
// You can now show a confirmation message to the customer
});
}
}, '#paypal-button3');