Question

好的，所以我试图使用jQuery弹出一个滑动页脚，我已经设置了html和css，但是我在制作jQuery脚本时遇到了麻烦。脚本文件是/js/slidingfooter.js，它看起来像这样：

jQuery(function($) {
var open = false;
$('#footerSlideButton').click(function() {
    if(open === false) {
        $('#footerSlideContent').animate({ height: '300px' });
        $(this).css('backgroundPosition', 'bottom left');
        open = true;
    } else {
        $('#footerSlideContent').animate({ height: '0px' });
        $(this).css('backgroundPosition', 'top left');
        open = false;
    }
});     
});

我尝试在functions.php文件中调用它，如下所示：

function add_my_script() {
    wp_enqueue_script(
        'slidingfooter',
        get_template_directory_uri() . '/js/slidingfooter.js',
        array('jquery') 
    );
}

但所有这一切都是当我刷新页面时，它会显示functions.php中的代码，只显示标题上方的代码。

我不知道自己做错了什么。

Answer 1

问题是你正在调用一个返回javascript的php。 Mime类型不是与javascript相关的php文档，而是与html相关联。所以，我可以在这看到两个解决方案，
1）将你的javascript代码包装在里面

<script type="text/javascript">
    jQuery(function($) {
    var open = false;
    $('#footerSlideButton').click(function() {
        if(open === false) {
            $('#footerSlideContent').animate({ height: '300px' });
            $(this).css('backgroundPosition', 'bottom left');
            open = true;
        } else {
            $('#footerSlideContent').animate({ height: '0px' });
            $(this).css('backgroundPosition', 'top left');
            open = false;
        }
    });     
    });
</script>

或（更好的方式）
2）用上面的方法（1）将你的javascript代码插入到当前的html文档中您也可以触发on a button click或using time

用于滑动页脚的jQuery脚本有问题

1 个答案: