我正在创建一个网上商店,在该网上商店中单击产品时,我使用带有 iframe 的fancybox 来显示产品的详细信息页面。
在产品的详细信息页面中,您可以通过 AJAX 调用购买产品。该调用将购买发送到数据库并更新购物车金额。
但是,当我第一次单击购买按钮时,iframe 只是刷新。从第二次开始,按钮就可以正常工作了,但我不能再关闭fancybox了(既不能通过单击关闭按钮,也不能通过使用代码)。我也没有收到任何 javascript 错误,并且在自行打开产品详细信息页面(而不是在花哨的框中)时,一切正常。
由于我在任何地方都没有出现任何错误,并且没有fancybox,一切都可以正常工作,所以我真的不知道应该放哪段代码。
Fwiw 我正在运行 jquery 版本 1.8.3 和 fancybox 版本 1.3.4
编辑:这是相关代码
打开我的fancybox的javascript函数
function ShowAssetDetail(lngAssetID) {
$.fancybox(
{
'modal': false,
'width': 500,
'height': 500,
'autoscale': false,
'type': 'iframe',
'href': '/Code/Webshop/WS_Detail_Layout_2.asp?AssetID=' + lngAssetID
});
}
在 fancybox 中显示的 iframe
<div name="SHOPPINGCART" id="SHOPPINGCART" border="1">
<table class="ShoppingCart" title="Naar het detail van uw winkelmandje / Naar de kassa">
<tr>
<td>
<a href="/Code/Webshop/WS_Order_Detail.asp?">
€&nbsp;96,00
</a>
</td>
<td>
<a href="/Code/Webshop/WS_Order_Detail.asp?">
<img src="/code/_Images/WS_basket_go.gif" width="16" height="16" border="0" title="">
</a>
</td>
</tr>
</table>
</div>
<table class="AssetDetail_BuyAsset_Table" cellspacing="0" cellpadding="3px" width="100%">
<tr class="TableHeading1">
<td>P. iBTW</td>
<td colspan="2"> </td>
</tr>
<tr class="Normal_Text_1">
<td>€&nbsp;25,00</td>
<td><input type="text" name="X_PurchaseQuantity" id="X_PurchaseQuantity" size="5" value="3" onclick="this.select()">
<td><a href="#AddProductToShoppingCart" onclick="AddProductToShoppingCart(X,Y,document.getElementById('X_PurchaseQuantity').value,Z)"><img src="/code/_Images/WS_basket_add.gif" border="0"></a></td>
</tr>
</table>
javascript 函数和 AJAX 调用
<script language="JavaScript" type="text/JavaScript">
var strShoppingCartContainerElemID
var ajaxShoppingCartResponse;
var ajaxAssetAmountResponse;
var lngAjaxFinished;
var lngAjaxToFinish;
function AddProductToShoppingCart (lngAssetID,lngPriceID,dblPurchaseQuantity,dblAssetPrice) {
if (typeof(lngAssetID) == 'undefined' || typeof(lngPriceID) == 'undefined') return false;
StartUserWait(); //This just generates a spinner
lngAjaxFinished = 0;
lngAjaxToFinish = 1; //change into 2 when the orderitem amount/value is ever displayed again
var strShoppingCartURL = '/Code/_CommonCode/AJAX_Generic.asp?Proc=WS_AddAssetToShoppingCart';
ajaxShoppingCartResponse = CallAJAXURL(strShoppingCartURL,ReceiveAJAXShoppingCartResponse);
var strAssetAmountURL = '/Code/_CommonCode/AJAX_Generic.asp?Proc=WS_AmountAndValueOfAssetInShoppingCart';
ajaxAssetAmountResponse = CallAJAXURL(strAssetAmountURL, ReceiveAJAXAssetAmountResponse);
}
function ReceiveAJAXShoppingCartResponse(){
if (ajaxShoppingCartResponse) if (ajaxShoppingCartResponse.readyState == 4){
var records = ajaxShoppingCartResponse.responseText.split("<br>");
var results = records[0].split("___");
var lngOrderHeadID = parseInt(results[0]);
var dblTotalValue = parseInt(results[1]);
var strFormattedCurrency = results[2];
/*Write child's shoppingcart*/
WriteShoppingCart('SHOPPINGCART', dblTotalValue, strFormattedCurrency, 0);
/*Write parent's shoppingcart*/
WriteShoppingCart('SHOPPINGCART', dblTotalValue, strFormattedCurrency, 1);
ajaxShoppingCartResponse = undefined;
/*UpdateAjaxFinished();*/
}
}
function ReceiveAJAXAssetAmountResponse(){
if (ajaxAssetAmountResponse) if (ajaxAssetAmountResponse.readyState == 4)
{
var records = ajaxAssetAmountResponse.responseText.split("<br>");
var results = records[0].split("___");
var lngAssetID = parseInt(results[0]);
var dblTotalPurchaseQuantity = parseInt(results[1]);
var strTotalPurchasePrice = results[2];
if(parent.document.getElementById('AssetRow_' + lngAssetID)) {
if(dblTotalPurchaseQuantity > 0) {
parent.document.getElementById('AssetRow_' + lngAssetID).style.fontWeight = 'bold';
parent.document.getElementById('NOUnits_' + lngAssetID).value = dblTotalPurchaseQuantity;
} else {
parent.document.getElementById('AssetRow_' + lngAssetID).style.fontWeight = 'normal';
parent.document.getElementById('NOUnits_' + lngAssetID).value = '';
}
}
document.getElementById('X_PurchaseQuantity').value = dblTotalPurchaseQuantity;
ajaxAssetAmountResponse = undefined;
UpdateAjaxFinished();
}
}
function WriteShoppingCart(strContainerElemID, dblTotalValue, strFormattedCurrency, bitParent){
if (strContainerElemID == '') strContainerElemID = strShoppingCartContainerElemID
var container;
if(bitParent == 0) {
container = document.getElementById(strContainerElemID);
} else {
container = parent.document.getElementById(strContainerElemID);
}
if (!container) return false;
strShoppingCartContainerElemID = strContainerElemID;
var strHTML = '';
dblTotalValue = parseInt(dblTotalValue);
strHTML += '<table class="ShoppingCart">' + '\n';
strHTML += ' <tr>' + '\n';
if (dblTotalValue > 0){
strHTML += ' <td>' + '\n';
strHTML += ' <a href="/Code/Webshop/WS_Order_Detail.asp?"> \n';
strHTML += ' ' + strFormattedCurrency + '\n';
strHTML += ' </a>' + '\n';
strHTML += ' </td>' + '\n';
strHTML += ' <td>' + '\n';
strHTML += ' <a href="/Code/Webshop/WS_Order_Detail.asp?"> \n';
strHTML += ' <img src="/code/_Images/WS_basket_go.gif" width="16" height="16" border="0" TITLE=""> \n';
strHTML += ' </a>' + '\n';
strHTML += ' </td>' + '\n';
} else {
strHTML += ' <td>€ 0,00</td>' + '\n';
}
strHTML += ' </tr>' + '\n';
strHTML += '</table>' + '\n';
container.innerHTML = strHTML;
}
function UpdateAjaxFinished(){
if (typeof(lngAjaxFinished) == 'undefined') lngAjaxFinished = 0;
if (typeof(lngAjaxToFinish) == 'undefined') lngAjaxToFinish = 1;
lngAjaxFinished++;
if (lngAjaxFinished >= lngAjaxToFinish) EndUserWait(); //this stops the spinner
}
</script>