Question

我想从WordPress中的functions.php调用jQuery。

我正在使用Divi Theme。当我将脚本直接添加到Divi主题时，它可以工作。但是我想将它添加到我的孩子主题functions.php形式中，这就是问题的起点。

的functions.php

function coolbanner_enqueue() {
    wp_enqueue_script( 'custom-scripts', get_stylesheet_directory_uri() . '/js/coolbanner.js', array( 'jquery' ));
}
add_action( 'wp_enqueue_scripts', 'coolbanner_enqueue' );

脚本：

jQuery(document).ready(function(){
    jQuery('#cta-section').waypoint(function() {
        jQuery('#cta-section').toggleClass('animate-cta');
    }, {offset: '80%'});
});

有人可以指出我做错了吗？

Answer 1

解决方案：

function coolbanner_enqueue() {       
    wp_enqueue_script( 'custom-scripts-js', get_stylesheet_directory_uri() . '/js/coolbanner.js', array( 'jquery' ), '1.0', false);
}
add_action( 'wp_enqueue_scripts', 'coolbanner_enqueue' );

Answer 2

好像你错过了 jQuery Waypoint JS文件

尝试使用自定义脚本将jquery waypoint js文件 BEFORE 排入队列

function coolbanner_enqueue() {
    wp_enqueue_script( 'jquery-waypoint', 'https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js', [ 'jquery' ] );
    wp_enqueue_script( 'custom-scripts', get_stylesheet_directory_uri() . '/js/coolbanner.js', array( 'jquery-waypoint' ));
}
add_action( 'wp_enqueue_scripts', 'coolbanner_enqueue' );

你可以在这里找到jquery waypoint github repo ...

https://github.com/imakewebthings/waypoints

此外，我在下面使用的网址来自cdn，你可以在这里找到：

https://cdnjs.com/libraries/waypoints

如果你觉得使用github的网址更加舒服

然后用以下内容替换cdn url ...

https://raw.githubusercontent.com/imakewebthings/waypoints/master/lib/jquery.waypoints.min.js

从Wordpress中的functions.php调用jQuery

2 个答案: