如何解决如何向woocommerce_after_shop_loop_item添加倒计时
我正在尝试向产品目录(woocommerce商店页面)中的产品添加javascript倒计时。
我已将此代码添加到我的子主题中的wordpress functions.php中,但它似乎只想用于一种产品。
倒计时有效,但它没有添加到其他产品中。我需要在foreach中添加Javascript吗?但是不在函数中,而是在单独的JS文件中?
谢谢你们
add_action('woocommerce_after_shop_loop_item','lottery_data');
function lottery_data() {
global $product;
$min_tickets = $product->get_min_tickets();
$max_tickets = $product->get_max_tickets();
$lottery_participants_count = !empty($product->get_lottery_participants_count()) ? $product->get_lottery_participants_count() : '0';
$lottery_dates_to = $product->get_lottery_dates_to();
$lottery_dates_from = $product->get_lottery_dates_from();
$lottery_num_winners = $product->get_lottery_num_winners();
$diff = strtotime($lottery_dates_to) - strtotime($lottery_dates_from);
$now = time();
$your_date = strtotime($lottery_dates_from);
$datediff = $now - $your_date;
$ticketsLeft = $max_tickets - $lottery_participants_count;
echo '
<script>
const second = 1000,minute = second * 60,hour = minute * 60,day = hour * 24;
let countDown = new Date("'.$lottery_dates_to.'").getTime(),x = setInterval(function() {
let now = new Date().getTime(),distance = countDown - now;
document.querySelector(".days").innerText = Math.floor(distance / (day)),document.querySelector(".hours").innerText = Math.floor((distance % (day)) / (hour)),document.querySelector(".minutes").innerText = Math.floor((distance % (hour)) / (minute)),document.querySelector(".seconds").innerText = Math.floor((distance % (minute)) / second);
},second);
</script>
<hr class="blueLine">
<div class="customify-grid">
<div id="countdown" class="customify-col-4_md-4_sm-6_xs-12 center">
<div class="countdown-container" style="font-size:13px;">
<span class="days"></span> : <span class="hours"></span> : <span class="minutes"></span> : <span class="seconds"></span>
</div>
</div>
<div class="customify-col-4_md-4_sm-6_xs-12 center">
'. $ticketsLeft .'
</div>
<div class="customify-col-4_md-4_sm-6_xs-12 center">
'.$lottery_dates_to.'
</div>
</div>';
}```
解决方法
如果每个产品都有不同的文件,则应将javascript代码添加到不同的文件中,然后仅将其包含在每个产品文件中。
只需将javascript包装在
如果要把所有产品后端都放在一个文件中,则可以,每个文件都需要。
您可以通过检查具有该类名称的HTML对象的长度,然后按ID放置循环来完成此操作。
那是我会怎么做的。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。