条纹“简单”结帐 - 检测是否单击了关闭按钮答案

【问题标题】：Stripe "Simple" Checkout - detect if close button is clicked条纹“简单”结帐 - 检测是否单击了关闭按钮
【发布时间】：2014-01-29 20:21:37
【问题描述】：

我已将Stripe Checkout 集成到我的网站中，除了一个方面外，一切都很好。我使用“简单”结帐模式，Stripe 为我呈现结帐按钮。但我在文档中看不到检测用户是否单击关闭按钮的方法（有效地取消了交易 - 参见图片）。

有没有办法在“简单”模式（而不是自定义）中检测到这一点？

【问题讨论】：

标签： javascript stripe-payments

【解决方案1】：

好吧，你不能有回调，但是如果你在从你的 DOM 中删除 iframe 时创建自己的回调呢。

$(document).on("DOMNodeRemoved",".stripe_checkout_app", close);

function close(){
  alert("close stripe");
}

因此，虽然“关闭”回调确实不可用，但这个小技巧可以帮助您。

//这个例子是 JQuery 的。

--- 编辑 ---

正如@artfulhacker 评论的另一种方法是使用 setInterval 计时器并检查类 .stripe_checkout_app 是否为 visible，可能类似于：

setInterval(function(){
    if(!$('.stripe_checkout_app').is(":visible")){
       alert("Stripe modal is hidden");
    }
},1000)

【讨论】：

由于您使用的是 jquery，您可能希望使用 $('.stripe_checkout_app').is(":visible") stripe 不会为我们从页面中删除 dom
很酷，在我的情况下，这是他们删除 dom 的另一种方式
只是一个问题，您是否设置了一个计时器或者您如何分配 is:visible to an event？
这两种方法都坏了。在移动设备上，条带对话框是一个新选项卡，因此 $('.stripe_checkout_app').is(":visible") 将始终返回 false。我仍在寻找可行的解决方案。
我发现在桌面和移动设备上可靠工作的唯一方法是注册“令牌”回调和“关闭”回调。如果在调用“关闭”时之前没有调用过“令牌”，则用户关闭窗口而不生成“令牌”（即不付款）

【解决方案2】：

我发现的最简单的方法就是设置一个经过测试的提交变量。

    var submittedForm = false;

    var handler = StripeCheckout.configure({
        key: '{{ stripe.public_key }}',
        allowRememberMe: false,
        token: function(response, extradata) {
            var token = response.id;
            var card = response.card.id;
            submittedForm = true;
            $('#submit-text').html('Processing, stand by');
         //etc functionality to submit back to your own form
            }
    });



    //when actually triggering checkout.js
    handler.open({
                name: 'myCompanyName',
                amount: 1999,
     closed: function () {
                    if(submittedForm == false)
                        $('#submit-text').html('Start your Trial');
                }
           }
    });

此示例在打开 checkout.js 时更改了提交按钮文本。如果它实际处理，那么我们会返回一个令牌，将提交设置为 true。封闭测试了这一点。如果它是假的，这意味着他们没有提交就点击了X，所以我们将提交文本设置回来。如果为真，请忽略，以便在我们自己的 ajax 发布或其他内容完成时保留“正在处理”。

【讨论】：

【解决方案3】：

（我在 Stripe Checkout 工作）

“关闭”回调仅在 custom integration 中可用。

【讨论】：

谢谢，我在文档中看到了 cmets，但希望有一个简单模式的快速钩子。
Closed 在提交表单时调用，即使成功。如何检测 Stripe 是否打开，然后关闭，而没有提交数据，也就是取消？现在我有handler.open({closed : function(){/*this calls no matter what*/}})
你有什么解决办法吗？其实我卡住了。当我使用 handler.open({close : function(){}}) 加载程序关闭时，用户关闭弹出窗口或在重定向到成功页面之前完成付款。任何帮助将不胜感激@bafromca