阻止Amazon Pay按钮打开弹出窗口

Question

I have the following button (or link) that I'm biding to it the Amazon Payment Event. 我有以下要向其出价的按钮（或链接），即Amazon Payment Event。

<a id="AmazonPayButton"></a>

The biding goes as follows: 招标如下：

var btn = OffAmazonPayments.Button("AmazonPayButton", "AmAzOnCoDeHerE", {
        type: "PwA", color: "LightGray",
        authorization: function () {
        loginOptions = { scope: "profile payments:widget payments:shipping_address" };
        taxes = "0";
        authRequest = amazon.Login.authorize(loginOptions, "https://SomeIpHere.com/payment.aspx?taxes=" + taxes);

    },
    onError: function (error) {
    }
});

Now with jQuery I defined the click event to do some validations. 现在，使用jQuery我定义了click事件以进行一些验证。

$("#AmazonPayButton").click(function(e){
    if(..) {
        //Allow
    }
    else {
        e.preventDefault();
        return false;
    }
});

I expect that in case of else , the popup won't open, but still it does, how can I prevent it from opening? 我希望在else情况下，弹出窗口不会打开，但仍然可以打开，如何防止它打开？

Answer 1

This is a bit of a guess because I've never used OffAmazonPayments.Button , but: If it also defines a click handler on the button, what you're doing won't stop that handler from running. 这有点猜测，因为我从未使用过OffAmazonPayments.Button ，但是：如果它还在按钮上定义了一个click处理程序，那么您所做的将不会阻止该处理程序运行。 To do that, make sure you hook up your handler with jQuery first (before you call OffAmazonPayments.Button for that link), and in your handler use e.stopImmediatePropagation() to stop other event handlers on the link from being called. 要做到这一点，请确保您挂接与jQuery处理程序第一个 （在打电话前OffAmazonPayments.Button该链接），并在你的处理器使用e.stopImmediatePropagation()以阻止其他事件处理程序的链接被调用。

Here's an example — your current handler's code for "stopping" the event doesn't prevent other handlers at the same level from being run: Live Copy 这是一个示例—您当前用于“停止”该事件的处理程序的代码不会阻止运行相同级别的其他处理程序：实时复制

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<meta charset=utf-8 />
<title>stopImmediatePropagation Example</title>
</head>
<body>
  <div id="foo">click me</div>
  <script>
    (function() {
      $("#foo").click(function(e) {
        display("one");
        e.preventDefault();
        return false;
      })
      $("#foo").click(function() {
        display("two");
      })
      function display(msg) {
        $("<p>").html(String(msg)).appendTo(document.body);
      }
    })();
  </script>
</body>
</html>

But if we add e.stopImmediatePropagation(); 但是，如果我们添加e.stopImmediatePropagation(); , the second handler doesn't run anymore: Live Copy ，第二个处理程序不再运行：实时复制

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<meta charset=utf-8 />
<title>stopImmediatePropagation Example</title>
</head>
<body>
  <div id="foo">click me</div>
  <script>
    (function() {
      $("#foo").click(function(e) {
        display("one");
        e.preventDefault();
        e.stopImmediatePropagation();
        return false;
      })
      $("#foo").click(function() {
        display("two");
      })
      function display(msg) {
        $("<p>").html(String(msg)).appendTo(document.body);
      }
    })();
  </script>
</body>
</html>

Side note: If you return false; 注意：如果return false; from a jQuery event handler, calling e.preventDefault() is redundant. 从jQuery事件处理程序中，调用e.preventDefault()是多余的。 jQuery sees the false return value and calls e.stopPropagation() and e.preventDefault() for you (but not e.stopImmediatePropagation() ). jQuery看到false返回值，并为您调用e.stopPropagation()和e.preventDefault() （但没有e.stopImmediatePropagation() ）。

Answer 2

I realize this is an old question, but as I had the same problem and came across this topic here, I figure this answer might help someone else in future. 我意识到这是一个古老的问题，但是由于我遇到了同样的问题，并且在这里遇到了这个话题，我认为这个答案将来可能会对其他人有所帮助。

I had the same need to do some validation and potentially prevent the Amazon Payment button from submitting and creating a popup. 我同样需要做一些验证，并有可能阻止Amazon Payment按钮提交和创建弹出窗口。 The solution is actually pretty simple, as it turns out. 事实证明，该解决方案实际上非常简单。 Just insert your validation code into their authorization function when constructing the button. 构造按钮时，只需将验证代码插入其授权功能即可。 You will of course need to deal with scope when adding your own function references in there, but I leave that exercise to you. 在其中添加自己的函数引用时，您当然需要处理范围，但是我将其留给您。

Given the original code snippet, here is an example: 给定原始代码段，下面是一个示例：

var btn = OffAmazonPayments.Button("AmazonPayButton", "AmAzOnCoDeHerE", {
        type: "PwA", color: "LightGray",
        authorization: function () {
//// validation code added here
            if (!validationCheckPasses()) {  // your validation would go here
                return;  // don't allow button to submit if validation failed
            }
////
            loginOptions =
    { scope: "profile payments:widget payments:shipping_address" };
            taxes = "0";
            authRequest = amazon.Login.authorize(loginOptions, "https://SomeIpHere.com/payment.aspx?taxes=" + taxes);

        },

        onError: function (error) {
        }
    });

阻止Amazon Pay按钮打开弹出窗口

问题描述

2 个解决方案

解决方案1
1 2014-03-14 08:17:29

解决方案2
0 2014-10-26 13:19:09

阻止Amazon Pay按钮打开弹出窗口

问题描述

2 个解决方案

解决方案1 1 2014-03-14 08:17:29

解决方案2 0 2014-10-26 13:19:09

解决方案1
1 2014-03-14 08:17:29

解决方案2
0 2014-10-26 13:19:09