从WordPress中的functions.php调用jQuery

我想从我在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%'});
});

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

#1

似乎你缺少jQuery Waypoint JS文件

在使用自定义脚本之前, 尝试使jQuery Waypoint js文件入队

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网址替换为以下内容…

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

#2

解：

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' );