Bagaimana untuk Mengemas kini Kiraan Item Troli Pengepala WooCommerce Secara Dinamik Menggunakan Ajax?

Mary-Kate Olsen
Lepaskan: 2024-10-29 18:32:02
asal
679 orang telah melayarinya

How to Dynamically Update WooCommerce Header Cart Item Count Using Ajax?

Pengiraan Item Troli Pengepala Ajaxify dalam Woocommerce

Ikhtisar:

Dalam Woocommerce, mengemas kini kiraan item troli pengepala apabila ditambahkan /mengalih keluar item boleh dicapai tanpa muat semula halaman menggunakan Ajax.

Penyelesaian:

1. Penanda HTML untuk Kiraan Troli:

Dalam header.php tema anda, tambahkan kod berikut untuk membenamkan kiraan troli dalam teg HTML dengan ID atau kelas unik:

<code class="html"><?php 
$items_count = WC()->cart->get_cart_contents_count(); 
?>
<div id="mini-cart-count"><?php echo $items_count ? $items_count : ' '; ?></div></code>
Salin selepas log masuk

2. Pelaksanaan Kod:

Seterusnya, tambahkan kod ini pada fail functions.php anda atau mana-mana fail pemalam:

<code class="php">add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_mini_cart_count');
function wc_refresh_mini_cart_count($fragments){
    ob_start();
    $items_count = WC()->cart->get_cart_contents_count();
    ?>
    <div id="mini-cart-count"><?php echo $items_count ? $items_count : ' '; ?></div>
    <?php
        $fragments['#mini-cart-count'] = ob_get_clean();
    return $fragments;
}</code>
Salin selepas log masuk

Kail ini mengemas kini elemen "mini-cart-count" dengan kiraan yang dikemas kini selepas menambah item pada troli.

3. Pencetus jQuery pilihan:

Jika anda ingin memaksa kemas kini kiraan melalui jQuery, gunakan salah satu daripada acara yang diwakilkan ini:

<code class="javascript">$(document.body).trigger('wc_fragment_refresh');</code>
Salin selepas log masuk
<code class="javascript">$(document.body).trigger('wc_fragments_refreshed');</code>
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk Mengemas kini Kiraan Item Troli Pengepala WooCommerce Secara Dinamik Menggunakan Ajax?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan