导航到新网址时，Javascript 在 Safari 中不起作用

Question

在进行账单支付时，我会显示一个静态 Bootstrap 弹出窗口，告诉用户等待。用户单击一个按钮，该按钮调用 js 函数来显示弹出窗口，然后将用户重定向到在服务器端运行计费的 url。它适用于除 Safari 之外的所有浏览器。当我单击 Safari 中的按钮时，不会出现弹出窗口，它只是导航到计费页面。我注意到，如果删除导航线(location.replace('/billingpage/pay/');)，弹出窗口将在 safari 中正确显示。看起来如果 javascript safari 中有导航则不会显示弹出窗口。

我还尝试将导航放入另一个函数中，并在超时后调用它，如下所示:window.setTimeout(navigate(), 1000);但这也不起作用。

function pay_now() {
  document.getElementById("paynow_btn").disabled=true;
  document.getElementById("paynow_btn").style.opacity = 0.25;
  var wait_title = "Please wait while the transaction is processed...";
  var wait_message = "<br/><br/><br/><br/> ";
  document.getElementById("staticModalLabel").innerHTML = wait_title;
  document.getElementById("staticModalBody").innerHTML = wait_message;
  var spinner = new Spinner().spin();
  document.getElementById("staticModalBody").appendChild(spinner.el);
  $('#staticPopupModal').modal({
    backdrop: 'static',
    keyboard: false
  });
  location.replace('/billingpage/pay/');
}

 <a href="javascript:pay_now();" id="paynow_btn" class="btn btn-green">PAY</a>

Answer 1

这不应该是每个 javascript 进程的预期行为吗？ 不管怎样，就你而言，我肯定会选择 jquery deferred 和 Promise。这是fiddle我已经用 jqueryui 制作了一个模式对话框。

基本上它在代码中是这样的。

var dfd = $.Deferred();

$("#dialog-confirm").dialog({
    resizable: false,
    height: 140,
    modal: true,
    buttons: {
        "go to billing page": function () {
            $(this).dialog("close");
            dfd.resolve();
        },
        Cancel: function () {
            $(this).dialog("close");
            dfd.reject();
        }
    }
});

$.when(dfd).then(

function () {
    alert('go to billing page');
},

function () {
    alert('nope');
});