如何将 Wordpress php 代码添加到 JavaScript 中

Question

我有以下 javascript 代码：

$(window).scroll(function() {
    if($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-default').addClass('sticky');
        $('.navbar-brand img').attr('src','assets/images/logo.png'); //change src
    } else {
        $('.navbar-default').removeClass('sticky');
        $('.navbar-brand img').attr('src','assets/images/logo__footer.png')

    }
});

是否可以插入 wp 自定义 php 代码

<?php the_custom_logo(); ?>

而不是这个静态属性

.attr('src','assets/images/logo.png');

提前谢谢了。

Answer 1

您需要在模板中设置变量：

<script>
    var logoImage = <?php the_custom_logo(); ?>;
    var logoImageFooter = <?php the_custom_logo()?> //here footer logo
</script>

然后，在你的 js 文件中使用它

$(window).scroll(function() {
    if($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-default').addClass('sticky');
        $('.navbar-brand img').attr('src',logoImage); //change src
    } else {
        $('.navbar-default').removeClass('sticky');
        $('.navbar-brand img').attr('src',logoImageFooter)

    }
});