Safariブラウザがwindow.location後にjs実行を停止します

Question

ボタンクリックで（偽の）進捗バーを表示するjsコードがあります。それはそれはクロームでは、Firefoxなど

完璧に動作します。しかし、それはサファリに来るとき、それはwindow.locationのラインに達した上でJSの実行を停止し、プログレスバー

$(".quickbook-btn").click(function(){ 
    $(".progress").removeClass('hide') 
    setTimeout(barAnim, 50); 
    window.location = path 
}); 

var value = 0; 
function barAnim(){ 
    value += 5; 
    $(".progress-bar").css("width", value + "%").attr("aria-valuenow", value); 
    $(".progress-bar").text((value)+'%'); 
    if (value == 10 || value == 20 || value == 30|| value == 50 || value == 75 || value == 90) { 
    return setTimeout(barAnim, 1500); 
    } 
} 

の値を変更して設定された時間よりも 。

私は、window.locationのurlが完了するまでに10秒以上かかりますが、50％まで到達可能で、window.locationを呼び出すよりすぐにjsの実行を停止するようにテストしました。

ここで問題は何ですか？どうしてサファリが吸うのですか

Answer 1

適切な解決策が見つからない場合、私は返信用window.locationで自分のリクエストをajax &に移しました。

$(".quickbook-btn").click(function(){ 
     $(".progress").removeClass('hide') 
     setTimeout(barAnim, 50); 

     $.ajax({ 
     method: "GET", 
     url: "#{path}", 
     }).done(function(data) { 
     $(".progress-bar").css("width", 100 + "%").attr("aria-valuenow", 100); 
     $(".progress-bar").text((100)+'%'); 
     window.location = "#{club_quick_books_path}" 
     }); 
    }); 

    var value = 0; 
    function barAnim(){ 
     value += 5; 
     $(".progress-bar").css("width", value + "%").attr("aria-valuenow", value); 
     $(".progress-bar").text((value)+'%'); 
     if (value == 10 || value == 20 || value == 30|| value == 50 || value == 75 || value == 90) { 
      return setTimeout(barAnim, 1500); 
     } 
     return value >= 95 || setTimeout(barAnim, 50); 
    }