更新スクリプトはEdge以外のすべてのブラウザで動作します

Question

ワンボタンで複数のフォームをショッピングカートに送信するスクリプトを作成しました。提出が完了すると、実際にカートページに行くことなく、カートの内容を更新するために新しい機能updateCartAjax()が発動されます。

このスクリプトは、Edge以外のすべてのブラウザで正常に動作します。どういうわけか、フォームをカートに正しく追加すると機能が正しく機能するように見えますが、カートを更新するのは正しくありません。

クッキーをクリアすると、初めて正しく機能します。他のものをカートに追加すると、機能updateCartAjax()は発砲されません。しかし、F5を押すと機能します。

スクリプトには私が見逃したことがあり、updateCartAjax()が機能しない可能性がありますか？私はどんなブラウザでも私のコンソールに何のエラーもありません！

マイスクリプト

// forms look like 
<div class="temp-cart"> 
    <form id="form_19093981" method="post" action="/cart/add/19093981/"></form> 
    <form id="form_19093982" method="post" action="/cart/add/19093982/"></form> 
    <form id="form_19093983" method="post" action="/cart/add/19093983/"></form> 
    <form id="form_19093984" method="post" action="/cart/add/19093984/"></form> 
    <button type="submit" class="btn btn-custom-2 addToCart">Submit!</button> 
</div> 


function updateCartAjax() { 
    $.get("/cart/?format=json", function(e) { 
     var a = getAjaxTranslation, 
      t = [], 
      i = e.shop.currency2; 
     if (e.page.cart) { 
      e.page.cart.products.forEach(function(e) { 
       t.push('<li class="item clearfix"> <a href="cart/delete/' + e.qid + '" title="' + a("Delete") + '" class="delete-item" data-qid="' + e.qid + '"><i class="fa fa-times"></i></a> <figure> <a href="' + e.url + '" title="' + e.fulltitle + '">  <img src="' + imageIdToUrl(e.image, "60x60x2") + '" width="60" height="60" alt="' + e.fulltitle + '" title="' + e.fulltitle + '" /> </a> </figure> <div class="dropdown-cart-details"> <p class="item-name">  <a href="' + e.url + '" title="' + e.fulltitle + '">  ' + (e.brand.title ? "<span>" + e.brand.title + "</span>" : "") + "  " + e.title + '  <span class="variant">' + e.variant + "</span>  </a> </p> <p>  " + e.quantity + 'x  <span class="item-price">' + i.symbol + e.price.price + "</span> </p> </div></li>") 
      }); 
      var s = '<div class="dropdown-cart-menu-container"> <div class="btn-group dropdown-cart"> <div class="dropdown-toggle" data-toggle="dropdown">  <div class="minicart"></div>  <div class="info">  <span class="cartitems"><b>' + e.page.cart.products.length + "</b> " + a("Items") + '</span>  <span class="cartprice">' + i.symbol + e.page.cart.total.price.toFixed(2).replace(/\./g, ',') + '</span>  </div> </div> <div class="dropdown-menu dropdown-cart-menu pull-right clearfix" role="menu">  <ul class="dropdown-cart-product-list">' + t.join("") + '</ul>  <ul class="dropdown-cart-total">  <li><span class="dropdown-cart-total-title">  ' + a(e.shop.b2b ? "Total excl. VAT" : "Total") + "</span>" + i.symbol + e.page.cart.total.price.toFixed(2) + '</li>  </ul>  <div class="dropdown-cart-action">   <span><a href="/cart" title="' + a("My shopping cart") + '">' + a("Edit") + '</a></span>   <span><a href="' + a("Checkout") + '" class="btn btn-custom" title="' + a("Checkout") + '">' + a("Checkout") + "</a></span>  </div> </div> </div></div>" 
     } 
     $("#cart").html(s) 
    }) 
} 



    var state = false; 

    $(document).ready(function() { 
    $('.temp-cart .addToCart').click(function() { 
     go(); 

     // get all forms on the page 
     $forms = $('.temp-cart form'); 
     sent = 0; 

     // post the form (non-async) 
     $forms.each(function() { 
     if(state) { 
      var qty = $(this).find('.amt').text(); 
      var qty2 = parseInt(qty); 
      var url = $(this).attr('action')+'?quantity='+qty2+'/'; 
      $.ajax({ 
      type: "post", 
      async: false, 
      url: url, 
      data: $(this).serialize(), 
      success: function(data) { 
       if(++sent == $forms.length) { 
       console.log('All forms are submitted!'); 

       // updateStuff(); 
       updateCartAjax(); 

       } 
      } 
      }); 
     } else { return false; } 
     }); 
     stop(); 
    }); 

    function go() { 
     if(!state) { 
     state = true; 
     $('.temp-cart .addToCart').button('loading'); 
     $('input[type=button], input[type=submit]').attr("disabled", "disabled"); 
     }} 

    function stop() { 
     if(state) { 
     state = false; 
     $('.temp-cart .addToCart').button('reset'); 
     $('input[type=button], input[type=submit]').removeAttr("disabled"); 
     }} 
    }); 

Answer 1

はキャッシュ

これは、頻繁にキャッシュされることになりやすいかもしれないシナリオのような音のように聞こえます。私の経験では、AJAXのキャッシングとディセーブル化については、これを解決するのに役立つかもしれません。あなたが明示的にドキュメントレディ機能の中に以下のコードスニペットを経由してAJAXのキャッシュをオフにすることができ

：

$(document).ready(function() { 
    // Disable AJAX-based caching 
    $.ajaxSetup({ cache: false }); 

    // Other code omitted for brevity 
}); 

これは明らかに、よりグローバルなソリューションである、しかし、あなたは、個々のAJAX要求時にcacheプロパティを設定することができますご想像の通り：

$.ajax({ 
    method: 'GET', 
    url: '...', 
    cache: false, 
    success: function(){ 

    } 
}); 

またはちょうどあなたが要求しているURLにクエリ文字列値を追加することによって：

を

問題が解決しない場合は は、実際の要求が行われているかどうかを確認するために[ネットワーク]タブをブラウザ内開発者ツール（F12）を使用して、および監視を検討し開発者ツール（F12）を使用し、彼らはどちらか失敗している場合キャッシュから返されるだけです。