使用Ajax/jQuery更新div

Question

我有一個Magento商店，我需要在添加產品後更新側邊欄推車。

但我不能讓它工作...我已經嘗試了很多東西，但我沒有選擇。

我有這樣的功能：

function setLocationAjax(url, id) 
{ 
    url = url.replace("checkout/cart", "ajax/index"); 
    url += 'isAjax/1/'; 
    if ('https:' == document.location.protocol) { 
     url = url.replace('http:', 'https:'); 
    } 
    $('#ajax_loading' + id).css('display', 'block'); 
    try { 
     $.ajax({ 
      url:url, 
      dataType:'jsonp', 
      success:function (data) { 
       $('#ajax_loading' + id).css('display', 'none'); 
       showMessage(data.message); 
       if (data.status != 'ERROR' && $('.cart_sidebar_container').length) { 
        $('.cart_sidebar_container').replaceWith(data.cart_top); 
       } 
      } 
     }); 
    } catch (e) { 
    } 
} 

這是HTML/PHP代碼：

<?php $_cartQty = $this->getSummaryCount(); if (is_null($_cartQty)) $_cartQty = 0; ?> 
<?php $params = $this->getRequest()->getParams(); if(empty($params['isAjax'])) : ?> 
<div class="cart-top-title"><a href="<?php echo $this->getUrl('checkout/cart') ?>" class="clearfix"><span class="icon"></span><?php echo $this->__('Shopping cart'); ?></a></div> 
<?php endif; ?> 
<div class="cart_sidebar_container"> 
<div class="cart-top"> 
    <a class="summary" href="<?php echo $this->getUrl('checkout/cart') ?>"></a> 
    <span><?php echo $this->__('BAG').' ('.$_cartQty.')'; ?></span> 
</div> 
<div class="details details-sidebar"> 
    <div class="details-border"></div> 
    <?php $_items = $this->getRecentItems() ?> 
    <?php if(count($_items)): ?> 
    <p class="block-subtitle text-recently"><?php echo $this->__('Recently added item(s)') ?></p> 
    <ol id="cart-sidebar" class="mini-products-list"> 
     <?php foreach($_items as $_item): ?> 
     <?php echo $this->getItemHtml($_item) ?> 
     <?php endforeach; ?> 
    </ol> 
    <div class="subtotal-wrapper"> 
     <div class="subtotal"> 
      <?php if ($this->canApplyMsrp()): ?> 
      <span class="map-cart-sidebar-total"><?php echo $this->__('ORDER TOTAL WILL BE DISPLAYED BEFORE YOU SUBMIT THE ORDER'); ?></span> 
      <?php else: ?> 
       <span class="label"><?php echo $this->__('Cart Subtotal:') ?></span> <?php echo Mage::helper('checkout')->formatPrice($this->getSubtotal()) ?> 
      <?php if ($_subtotalInclTax = $this->getSubtotalInclTax()): ?> 
       <br />(<?php echo Mage::helper('checkout')->formatPrice($_subtotalInclTax) ?> <?php echo Mage::helper('tax')->getIncExcText(true) ?>) 
       <?php endif; ?> 
      <?php endif; ?> 
     </div> 
    </div> 
    <div class="buttons"> 
     <div class="button_wrap"> 
      <button type="button" title="<?php echo $this->__('View Cart') ?>" class="button btn-continue" onclick="setLocation('<?php echo $this->getUrl('checkout/cart') ?>')"><span><span><?php echo $this->__('View Cart') ?></span></span></button> 
     </div> 
     <?php if($_cartQty && $this->isPossibleOnepageCheckout()): ?> 
      <?php echo $this->getChildHtml('extra_actions') ?> 
      <div class="button_wrap"> 
       <button type="button" title="<?php echo $this->__('Checkout') ?>" class="button btn-checkout" onclick="setLocation('<?php echo $this->getCheckoutUrl() ?>')"><span><span><?php echo $this->__('Continue to Checkout') ?></span></span></button> 
      </div> 
     <?php endif ?> 
    </div> 
    <?php else: ?> 
    <p class="a-center"><?php echo $this->__('You have no items in your shopping cart.') ?></p> 
    <?php endif ?> 
</div> 

有人可以幫助我？

我需要重新加載當前的代碼，現在它正在用另一個小型的div來替代div，這個小型div在懸停時加載購物車。

謝謝！

問候， 羅伯特

Answer 1

我真的不知道哪一個，可能是......

這是ajaxcart.js整個代碼：

//called from quick view iframe 
function setAjaxData(data,iframe){ 
//showMessage(data.message); 
if (data.status != 'ERROR' && jQuery('.cart-top-container').length) { 
    jQuery('.cart-top-container').replaceWith(data.cart_top); 
} 
} 

function showMessage(message) 
{ 
jQuery('body').append('<div class="alert"></div>'); 
var $alert = jQuery('.alert'); 
$alert.slideDown(400); 
$alert.html(message).append('<button></button>'); 
jQuery('button').click(function() { 
    $alert.slideUp(400); 
}); 
$alert.slideDown('400', function() { 
    setTimeout(function() { 
     $alert.slideUp('400', function() { 
      jQuery(this).slideUp(400, function(){ jQuery(this).detach(); }) 
     }); 
    }, 7000) 
}); 
} 

jQuery(function($) { 

$('.btn-cart').live('click', function() { 
    if ($(this).hasClass('show-options')) return false; 
    if ($(window).width() < 769) { 
     return false; 
    } 
    var cart = $('.cart-top'); 
    var imgtodrag = $(this).parents('li.item').find('a.product-image img:not(.back_img)').eq(0); 
    if (imgtodrag) { 
     var imgclone = imgtodrag.clone() 
      .offset({ top:imgtodrag.offset().top, left:imgtodrag.offset().left }) 
      .css({'opacity':'0.7', 'position':'absolute', 'height':'150px', 'width':'150px', 'z-index':'1000'}) 
      .appendTo($('body')) 
      .animate({ 
       'top':cart.offset().top + 10, 
       'left':cart.offset().left + 30, 
       'width':55, 
       'height':55 
      }, 1000, 'easeInOutExpo'); 
     imgclone.animate({'width':0, 'height':0}, function(){ $(this).detach() }); 
    } 
    return false; 
}); 


if (Shopper.quick_view) { 
    $('li.item').live({ 
     mouseenter: function(){ $(this).find('.quick-view').css('display', 'block'); }, 
     mouseleave: function(){ $(this).find('.quick-view').hide(); } 
    }); 
} 

$('.fancybox').live('click', function() { 
    if ($(window).width() < 769) { 
     window.location = $(this).next().attr('href'); 
     return false; 
    } 
    var $this = $(this); 
    var quick_view_href = $this.attr('href'); 
    if (Shopper.category != '') { 
     quick_view_href += 'qvc/'+Shopper.category+'/'; 
    } 
    if ('https:' == document.location.protocol) { 
     quick_view_href = quick_view_href.replace('http:', 'https:'); 
    } 
    $.fancybox({ 
     hideOnContentClick:true, 
     width:800, 
     autoDimensions:true, 
     type:'iframe', 
     href: quick_view_href, 
     showTitle:true, 
     scrolling:'no', 
     onComplete:function() { 
      $('#fancybox-frame').load(function() { // wait for frame to load and then gets it's height 
       $('#fancybox-content').height($(this).contents().find('body').height() + 30); 
       $.fancybox.resize(); 
      }); 
     } 
    }); 
    return false; 
}); 

$('.show-options').live('click', function(){ 
    $('#fancybox' + $(this).attr('data-id')).trigger('click'); 
    return false; 
}); 
$('.ajax-cart').live('click', function(){ 
    setLocationAjax($(this).attr('data-url'), $(this).attr('data-id')); 
    return false; 
}); 

function setLocationAjax(url, id) 
{ 
    url = url.replace("checkout/cart", "ajax/index"); 
    url += 'isAjax/1/'; 
    if ('https:' == document.location.protocol) { 
     url = url.replace('http:', 'https:'); 
    } 
    $('#ajax_loading' + id).css('display', 'block'); 
    try { 
     $.ajax({ 
      url:url, 
      dataType:'jsonp', 
      success:function (data) { 
       $('#ajax_loading' + id).css('display', 'none'); 
       showMessage(data.message); 
       if (data.status != 'ERROR' && $('.cart-top-container').length) { 
        $('.cart-top-container').replaceWith(data.cart_top); 
       } 
      } 
     }); 
    } catch (e) { 
    } 
} 

});