我搜索了一下,发现这个方法 此处 使用 wp_add_inline_script
. 而且它的工作原理。
但是如果我想把我的初始化脚本保留在其他的.js文件中呢?这就是我最初想要的。我怎样才能正确加载呢?我试过这样做,但加载我的 init-fancybox
一定是太早了,因为我得到一个错误。
(我的 init-fancybox
脚本不是问题,因为当它正确地使用 wp_add_inline_script
)
function fancybox_enqueues() {
wp_register_script( 'fancybox', get_theme_file_uri( '/assets/js/jquery.fancybox.min.js' ), array('jquery'), '3.5.7', true);
wp_register_script( 'init-fancybox', get_theme_file_uri( '/assets/js/init-fancybox.js' ), array('jquery','fancybox'), '1.0', true);
wp_register_style( 'fancybox-css', get_theme_file_uri( '/css/jquery.fancybox.min.css' ), '1.0');
if ( is_singular( 'item' ) ) {
wp_enqueue_script( 'jquery');
wp_enqueue_script( 'fancybox' );
wp_enqueue_script ('init-fancybox');
wp_enqueue_style( 'fancybox-css' );
}
}
add_action( 'wp_enqueue_scripts', 'fancybox_enqueues');
以下是我得到的错误信息 TypeError: $ is not a function
而这里是 init-fancybox.js
$('[data-fancybox="single-item__gallery"]').fancybox({
buttons : [
"zoom",
"share",
//"slideShow",
"fullScreen",
//"download",
"thumbs",
"close"
],
thumbs : {
autoStart : false
}
});
在你的代码运行时,似乎jQuery没有被加载。试着在它周围添加以下函数,以确保jQuery在你的代码运行之前就存在。
jQuery(document).ready(function ($) {
// Your function goes here:
$('[data-fancybox="single-item__gallery"]').fancybox({
buttons: [
"zoom",
"share",
//"slideShow",
"fullScreen",
//"download",
"thumbs",
"close"
],
thumbs: {
autoStart: false
}
});
});