i want to togle between 2 carts icon,one display when the cart is empty the second when is not,
<div id="div-icon-cart">
<span class="tools-icon">
<?php if ( ! WC()->cart->is_empty() ) { ?>
<img decoding="async" src="https://txxxx.com/uploads/cart.svg" class="custom-icon" alt="" height="20.738" width="17.626">
<?php } else{ ?>
<!-- begin snippet: js hide: false console: true babel: false -->but the problem is that the cart icon doesn't change immediately,i need to refrech the page to upload cart icon. for that i tried to reload div which contains my cart icon
$document.ready(function(){
$('#div-icon-cart').load();
setInterval{fonction(){
$('#div-icon-cart').load();
},3000};
});but doesn't work and i don't know why.i would be grateful for any help
NB:
It looks like the problem might just be some typos:
$document should be $(document){fonction should be (function},3000}; should be },3000);.load(), not sure exactly$(document).ready(function() {
$('#div-icon-cart').load();
setInterval(function() {
$('#div-icon-cart').load();
}, 3000);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="div-icon-cart">
<span class="tools-icon">
<?php if ( ! WC()->cart->is_empty() ) { ?>
<img decoding="async" src="https://txxxx.com/uploads/cart.svg" class="custom-icon" alt="" height="20.738" width="17.626">
<?php } else{ ?>Please try this code.
$(document).ready(function(){
$('#div-icon-cart').load();
setInterval(function(){
$('#div-icon-cart').load();
},3000);
});
You can use this code.
Please change your code like this.
$(document).ready(function(){
$('#div-icon-cart').load();
setInterval(function(){
$('#div-icon-cart').load();
},3000);
});