Php woocommerce刷新添加到购物车弹出div

我已经对woothemes.com主题（superstore）做了一些定制，这样当产品添加到购物车时，它现在会加载一个弹出div，这使客户可以继续购物或点击按钮结账-非常有用。这在单一产品页面上效果良好，例如-

但是

我还编辑了类别页面，以包含网格/列表视图切换：

在列表视图上，将显示“添加到购物车”按钮。如果单击“添加到购物车”按钮，将正确的项目添加到购物车，则问题在于弹出窗口显示添加的第一个产品的名称。因此，当您第一次添加产品时，弹出窗口会显示正确的产品名称，但是如果您不刷新页面并添加其他产品，弹出窗口仍会显示第一个产品名称-我认为这是因为弹出窗口div需要刷新，但我不确定如何执行此操作，有人能提供帮助吗

您可以在自己的项目中随意使用此代码：

jquery需要：

    *---ajax quantity add*/
    jQuery(document).ready(function($) {
    $(document).on( 'change', '.quantity .qty', function() {
    $(this).parent('.quantity').prev('#cart_btn').attr('data-quantity', $(this).val());
    });
    });

    /*---ajax add to cart and popup single product page*/
    jQuery(document).ready(function($){ 
        // Ajax add to cart
    $(document).on( 'click', '#cart_btn', function() {  

                    // popup
                    $('#popup_content').popup(
                    {
                    setcookie: false, 
                    selfclose: 0,
                    centered: true, 
                    floating: false,
                    popup_div: 'popup',
                    overlay: true,
                    opacity_level: 0.6,
                    popup_appear : 'show',
                    popup_appear_time : 0,
                    popup_disappear : 'fadeOut',
                    popup_disappear_time: 200               
                    });

        // AJAX add to cart request
        var $thisbutton = $(this);

        if ($thisbutton.is('.add_to_cart_button_popup')) {

            if (!$thisbutton.attr('data-product_id')) return true;

            var data = {
                action:         'woocommerce_add_to_cart',
                product_id:     $thisbutton.attr('data-product_id'),
                quantity:       $thisbutton.attr('data-quantity'),
                security:       woocommerce_params.add_to_cart_nonce
            };

            // Trigger event
            $('body').trigger( 'adding_to_cart', [ $thisbutton, data ] );

            // Ajax action
            $.post( woocommerce_params.ajax_url, data, function( response ) {

                if ( ! response )
                    return;

                var this_page = window.location.toString();

                if ( response.error && response.product_url ) {
                    window.location = response.product_url;
                    return;
                }

                // Redirect to cart option
                if ( woocommerce_params.cart_redirect_after_add == 'yes' ) {

                    window.location = woocommerce_params.cart_url;
                    return;

                } else {

                    $thisbutton.removeClass('loading');

                    fragments = response.fragments;
                    cart_hash = response.cart_hash;

                    // Block fragments class
                    if ( fragments ) {
                        $.each(fragments, function(key, value) {
                            $(key).addClass('updating');
                        });
                    }

                    // Block widgets and fragments
                    $('.shop_table.cart, .updating, .cart_totals').fadeTo('400', '0.6').block({message: null, overlayCSS: {background: 'transparent url(' + woocommerce_params.ajax_loader_url + ') no-repeat center', backgroundSize: '16px 16px', opacity: 0.6 } } );

                    // Replace fragments
                    if ( fragments ) {
                        $.each(fragments, function(key, value) {
                            $(key).replaceWith(value);
                        });
                    }

                    // Unblock
                    $('.widget_shopping_cart, .updating').stop(true).css('opacity', '1').unblock();

                    // Cart page elements
                    $('.shop_table.cart').load( this_page + ' .shop_table.cart:eq(0) > *', function() {

                        $("div.quantity:not(.buttons_added), td.quantity:not(.buttons_added)").addClass('buttons_added').append('<input type="button" value="+" id="add1" class="plus" />').prepend('<input type="button" value="-" id="minus1" class="minus" />');

                        $('.shop_table.cart').stop(true).css('opacity', '1').unblock();

                        $('body').trigger('cart_page_refreshed');

                    });

                    // update the popup cart notice
                    $("#popup_woocommerce_cart_notice_minimum_amount").html($("#woocommerce_cart_notice_minimum_amount").html());

                    $('.cart_totals').load( this_page + ' .cart_totals:eq(0) > *', function() {
                        $('.cart_totals').stop(true).css('opacity', '1').unblock();
                    });

                    // Trigger event so themes can refresh other areas
                    $('body').trigger( 'added_to_cart', [ fragments, cart_hash ] );

                }
            });

            return false;

        } else {
            return true;
        }

    });


});

*--ajax数量添加*/
jQuery（文档）.ready（函数（$）{
$（文档）.on（'change'，'.quantity.qty'，函数（）{
$（this）.parent（'.quantity'）.prev（'#cart_btn'）.attr（'data-quantity'，$（this.val（））；
});
});
/*---ajax添加到购物车并弹出单个产品页面*/
jQuery（文档）.ready（函数（$）{
//Ajax添加到购物车
$（文档）.on（'click'，'#cart_btn'，function（）{
//弹出窗口
$（“#弹出内容”）。弹出(
{
setcookie:错，
自动关闭：0，
对,，
浮动：假，
popup_div:“popup”，
对,，
不透明度_级别：0.6，
弹出窗口显示：“显示”，
弹出时间：0，
弹出式菜单“消失：'淡出'，
弹出\消失\时间：200
});
//AJAX添加到购物车请求
变量$thisbutton=$（此）；
if（$thisbutton.is（'.add_-to_-cart_-button_-popup'））{
if（！$thisbutton.attr（'data-product_id'））返回true；
风险值数据={
操作：“woocommerce\u添加到\u购物车”，
产品标识：$thisbutton.attr（“数据产品标识”），
数量：$thisbutton.attr（'data-quantity'），
安全性：woocommerce\u params.立即将\u添加到\u cart\u
};
//触发事件
$（'body'）。触发器（'adding_to_cart'，[$thisbutton，data]）；
//Ajax操作
$.post（woocommerce\u params.ajax\u url、数据、函数（响应）{
如果（！响应）
返回；
var this_page=window.location.toString（）；
if（response.error&&response.product\u url）{
window.location=response.product\u url；
返回；
}
//重定向到购物车选项
如果（添加后重定向）='yes'）{
window.location=woocommerce\u params.cart\u url；
返回；
}否则{
$thisbutton.removeClass（'loading'）；
fragments=response.fragments；
cart\u hash=response.cart\u hash；
//块碎片类
如果（碎片）{
$。每个（片段、函数（键、值）{
$（key）.addClass（'更新'）；
});
}
//块小部件和片段
$（'.shop_table.cart、.update、.cart_totals'）.fadeTo（'400'，'0.6'）.block（{message:null，overlycss:{background:'transparent url（'+woocommerce_params.ajax_loader_url+'））无重复中心，backgroundSize:'16px 16px，不透明度：0.6}）；
//替换碎片
如果（碎片）{
$。每个（片段、函数（键、值）{
$（键）。替换为（值）；
});
}
//解除封锁
$（'.widget\u shopping\u cart，.updateing'）.stop（true.css（'opacity'，'1'）.unblock（）；
//购物车页面元素
$（'.shop\u table.cart'）.load（此页面+'.shop\u table.cart:eq（0）>*'，函数（）{
$（“div.quantity:not（.buttons\u added）、td.quantity:not（.buttons\u added）”）.addClass（“buttons\u added”）.append（“”）.prepend（“”）；
$（'.shop_table.cart'）.stop（true）.css（'opacity'，'1'）.unblock（）；
$（'body'）。触发器（'cart_page_refreshed'）；
});
//更新弹出购物车通知
$（“弹出式”购物车通知“最低金额”）.html（$（“弹出式”购物车通知“最低金额”）.html（））；
$（'.cart\u totals'）.load（此页面+'.cart\u totals:eq（0）>*'，函数（）{
$（'.cart_totals'）.stop（true）.css（'opacity'，'1'）.unblock（）；
});
//触发事件，以便主题可以刷新其他区域
$（'body'）.trigger（'added_to_cart'，[fragments，cart_hash]）；
}
});
返回false；
}否则{
返回true；
}
});
});

然后在文件夹/woocommerce/single product/add to cart中：

    <?php
    /**
    * Custom Loop Add to Cart.
    *
    * Template with quantity and ajax.
    */

    if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly.

        global $product;
    ?>

    <?php if ( ! $product->is_in_stock() ) : ?>

    <a href="<?php echo apply_filters( 'out_of_stock_add_to_cart_url', get_permalink( $product->id ) ); ?>" class="button"><?php echo apply_filters( 'out_of_stock_add_to_cart_text', __( 'Read More', 'woocommerce' ) ); ?></a>

   <?php else : ?>

<?php
$link = array(
'url' => '',
    'label' => '',
'class' => ''
);

switch ( $product->product_type ) {
case "variable" :
$link['url'] = apply_filters( 'variable_add_to_cart_url', get_permalink( $product->id ) );
$link['label'] = apply_filters( 'variable_add_to_cart_text', __( 'Select options', 'woocommerce' ) );
break;
case "grouped" :
$link['url'] = apply_filters( 'grouped_add_to_cart_url', get_permalink( $product->id ) );
$link['label'] = apply_filters( 'grouped_add_to_cart_text', __( 'View options', 'woocommerce' ) );
break;
case "external" :
$link['url'] = apply_filters( 'external_add_to_cart_url', get_permalink( $product->id ) );
$link['label'] = apply_filters( 'external_add_to_cart_text', __( 'Read More', 'woocommerce' ) );
break;
default :
if ( $product->is_purchasable() ) {
$link['url'] = apply_filters( 'add_to_cart_url', esc_url( $product->add_to_cart_url() ) );
$link['label'] = apply_filters( 'add_to_cart_text', __( 'Add to cart', 'woocommerce' ) );
$link['class'] = apply_filters( 'add_to_cart_class', 'add_to_cart_button' );
} else {
$link['url'] = apply_filters( 'not_purchasable_url', get_permalink( $product->id ) );
$link['label'] = apply_filters( 'not_purchasable_text', __( 'Read More', 'woocommerce' ) );
}
break;
}

// If there is a simple product.
if ( $product->product_type == 'simple' ) {
?>
<form action="<?php echo esc_url( $product->add_to_cart_url() ); ?>" class="cart single_product_add_to_trolley" method="post" enctype="multipart/form-data">
<?php
// Display the submit button.
echo apply_filters( 'woocommerce_loop_add_to_cart_link', sprintf('<a href="%s" rel="nofollow" data-product_id="%s" data-product_sku="%s" id ="cart_btn" class="add_to_cart_button_popup button alt">Buy Now</a>', esc_url( $link['url'] ), esc_attr( $product->id ), esc_attr( $product->get_sku() ), esc_attr( $link['class'] ), esc_attr( $product->product_type ), esc_html( $link['label'] ) ), $product, $link );

// Displays the quantity box.
woocommerce_quantity_input();

?>
</form>

<?php
} else {
echo apply_filters( 'woocommerce_loop_add_to_cart_link', sprintf('<a href="%s" rel="nofollow" data-product_id="%s" data-product_sku="%s" class="%s button product_type_%s">%s</a>', esc_url( $link['url'] ), esc_attr( $product->id ), esc_attr( $product->get_sku() ), esc_attr( $link['class'] ), esc_attr( $product->product_type ), esc_html( $link['label'] ) ), $product, $link );
}

?>





    </form>
    <div id="popup_content" style="display:none;">
    <div class="close">
        <a href="#" id="baner_close" style="display: block; color:#ffffff; font-weight:700; text-transform:uppercase">x</a>
    </div>

    <div style="height:60px; margin-bottom:20px; margin-top:20px;">
        <span class="added_tick"></span>

        <div style="float:left; height:60px;display:table; width:307px;">
        <p style="display:table-cell; vertical-align:middle; font-size:1.2em; font-weight:700; color:#3C4653">
        <?php do_action('woocommerce_product_thumbnails'); 
        echo the_title()." has been added to your order<br />"; 
        ?>
        </p>
        </div>
    </div>

<div>

<div class="clear"></div> 

    <div style="width:390px; text-align:center; margin-bottom:20px;margin-top:40px;">
        <div style="width:100%">
        <a class="cont-shop-btn" id="baner_close2" href="#">Continue Shopping</a>
        <a id="chkout-btn" href="<?php echo $woocommerce->cart->get_cart_url();?>" title="<?php _e('Cart','woothemes') ?>">View Trolley</a> 
        </div>
    </div>  

    <div class="clear"></div> 


    <?php if ( ! dynamic_sidebar( 'Add to cart popup' ) ) :?><?php endif;?>


</div>
</div>

    <?php do_action('woocommerce_after_add_to_cart_form'); ?>



<?php endif; ?>