2

Shopify を使用してオンライン ストアを構築していますが、デフォルトのテンプレートにいくつかの jQuery/Ajax コードがあり、必要に応じて変更したいと考えています。

function addToCartSuccess (jqXHR, textStatus, errorThrown){

  $.ajax({
    type: 'GET',
    url: '/cart.js',
    async: false,
    cache: false,
    dataType: 'json',
    success: updateCartDesc
  });
  window.location = "/cart";
  $('.add-cart-msg').hide().addClass('success').html('Item added to cart! <a href="/cart" title="view cart">View cart and check out &raquo;</a>').fadeIn('300');
}

私は window.location 行を自分で追加して、カートページにメッセージを投稿すると思っていましたが、役に立ちませんでした。そのコードを削除すると、[カートに追加] ボタンが押されたときに製品ページに成功メッセージが表示されるため、変更せずに実際の作業が行われます。

また、POST コマンドを使用して独自の関数を作成しようとしましたが、このレベルの jQuery/Ajax の経験がないため、推測するのが最善です。

function updateCartDesc (jqXHR, textStatus, errorThrown){

  $.ajax({
    type: 'POST',
    url: '/cart',
    async: false,
    cache: false,
    dataType: 'html',
    success: function (){('.add-cart-msg').hide().addClass('success').html('Item added to cart! <a href="/cart" title="view cart">View cart and check out &raquo;</a>').fadeIn('300');
    }
});

どこが間違っているかについての指針はありますか？チュートリアル、ガイドなどは素晴らしいでしょう。ありがとう

4

1 に答える 1

3

カート ページにメッセージを表示するように指示する URL のパラメーターを使用して、ユーザーをカート ページにリダイレクトする必要があります。以下のようなもの：

Ajax のカートへの追加の呼び出しとコールバック

$.ajax({
    type: 'GET',
    url: '/cart.js',
    async: false,
    cache: false,
    dataType: 'json',
    success: updateCartDesc
});

var updateCartDesc = function() {
    //redirect the user to the cart and pass showSuccess=true in the URL
    window.location = "/cart?showSuccess=true";
};

カートページのスクリプト

$(function() {
    //if the current URL contains showSuccess,
    //display the success message to the user
    if(window.location.href.indexOf('showSuccess') != -1) {
        $('.add-cart-msg').hide()
                          .addClass('success')
                          .html('Item added to cart!')
                          .fadeIn('300');

    }
});

このコードは、 /cart ページに class を持つ要素があることを前提としていることに注意してくださいadd-cart-msg。

于 2012-08-16T22:43:56.190 に答える