javascript - WordPress 上的倒计时安装

Question

我尝试在 WordPress 网站 ( View Countdown ) 上安装基本倒计时，但没有任何反应。

我使用的 WordPress 主题是“HTML5Blank”。我像这样将 JavaScript 文件排入队列:

wp_register_script('jquery.plugin.min.js', get_template_directory_uri() . '/js/jquery.plugin.min.js', array('jquery'), '1.0.0'); // Custom scripts
wp_enqueue_script('jquery.plugin.min.js'); // Enqueue it!

wp_register_script('jquery.countdown.js', get_template_directory_uri() . '/js/jquery.countdown.js', array('jquery'), '1.0.0'); // Custom scripts
wp_enqueue_script('jquery.countdown.js'); // Enqueue it!

index.php 托管 div:

<div id="defaultCountdown"></div>

在 header.php 中初始化:

<script>
    (function ($) {
        var austDay = new Date();
        austDay = new Date(austDay.getFullYear() + 1, 1 - 1, 26);
        $('#defaultCountdown').countdown({
            until: austDay
        });
        $('#year').text(austDay.getFullYear());
    })(jQuery);
</script>

Answer 1

它没有填充，因为 #defaultCountdown元素不在 DOM/loaded 中，但是当您将脚本移到 <div id="defaultCountdown"></div> 之后时这样 JQuery 就获取了该元素并开始工作。

footer.php中的初始化脚本之后wp_footer .

<?php wp_footer(); ?>
<script>
    (function ($) {
        var austDay = new Date();
        austDay = new Date(austDay.getFullYear() + 1, 1 - 1, 26);
        $('#defaultCountdown').countdown({
            until: austDay
        });
        $('#year').text(austDay.getFullYear());
    })(jQuery);
</script>