这些事件处理程序中的哪一个应该在窗口关闭时触发自定义函数

Which of these event handlers should work to trigger a custom function on window close?

本文关键字:窗口 自定义函数 程序 事件处理 哪一个      更新时间:2023-09-26

好吧,我的数据管道运行良好,如果我将事件处理程序映射到输入点击触发器,它会通过Jquery/Ajax将数据发送到PHP处理文件,然后将数据写入SQL数据库。

然而,我尝试过的在窗口/页面关闭时触发Ajax发送的方法似乎都不起作用。我不想返回警报框,但是我在网上找到的所有示例似乎都只演示了使用onbeforenload、beforenlead和unload事件来显示警报框。他们还说你可以发起一个自定义事件,但我还没有找到这样一个事件的可靠例子。

伙计们,我做错了什么?这是代码。除了最新的,我所有尝试的触发器都接近评论的顶部,所以你们可以看到我已经尝试了什么。

var formData;
$(document).ready(function() {
//$("#driver").click(function() {
//$('a[rel!=ext]').click(function() { window.onbeforeunload = null; });
//$('form').submit(function() { window.onbeforeunload = null; });
//window.onbeforeunload = function() {
//jQuery(window).bind("beforeunload",function() {
//$(window).unload(function() {
$(window).bind("beforeunload", function() {
    var date=new Date();
    var formData = $("#testform :input[id!='card-type'][id!='paymentSelection_0']"+
    "[id!='ccSelectedRadio'][id!='card-number'][id!='card-exp-month'][id!='card-exp-year'][id!='card-cvv'][id!='billing-first-name']"+
    "[id!='billing-last-name'][id!='billing-company'][id!='billing-address1'][id!='billing-address2'][id!='billing-city']"+
    "[id!='billing-state'][id!='billing-zip'][id!='billing-phone'][id!='billing-country'][id!='useShippingRadio'][id!='useBillingRadio']"+
    "[id!='ppSelectedRadio'][name!='miscDS.shopperEmailAddress_ymixval'][name!='miscDS.shopperEmailAddress_ymixlabel']"+
    "[name!='miscDS.shopperEmailAddress_secname'][name!='paymentSelectionDS.paymentSelection_ROW0_paymentPPSelected']").serializeArray();
    $.post("jquery/process.php",
        {
            mydata: formData,
            orderSubTotal: orderSubTotal,
            orderTotal: orderTotal,
            numOfItems: numOfItems,
            items: items,
            ids: ids,
            codes: codes,
            qtys: qtys,
            price: price,
            orderTax: orderTax,
            orderShipping: orderShipping,
            appliedPromoIdList: appliedPromoIdList,
            coupon: coupon,
            storeId: storeId,
            activeShipPromotionCount: activeShipPromotionCount,
            itemImages: itemImages,
            date: date
        }
    );
});
});

就附加事件而言,这里显示的任何附加方法都很好。问题不在于你的附件方法本身,而在于你的函数执行异步任务,在情况改变之前需要"太长时间"才能完成。

当页面卸载时,任何挂起的AJAX请求都会被取消。因为ajax请求在默认情况下是异步的,所以在浏览器取消请求之前,您的请求甚至没有机会连接到服务器

对于这个用例,唯一的途径是使用同步请求。不过,这可能会造成不希望的效果:当您的请求挂起时,浏览器界面将显示并表现为"锁定"状态。

这就是为什么警报会起作用,因为它本质上是一种同步的"阻塞"情况。警报框有效地停止了整个浏览器UI以等待输入。

另请参阅:https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests