在 wordpress 中排队内置 jquery-ui 脚本时遇到问题

Question

我能够注册我自己下载的 jquery-ui 插件并将其排入队列，但控制台上到处都有错误。由于某种原因，我无法使用相同的方法加载 jquery-ui-core。

控制台还抱怨我的 $ 不是 $(document).ready(function) 初始 jquery 包装器的函数。即使 wp 正在调用它自己的内置于核心的 jquery 版本，我也明白这一点。

搜索文档表明 wp 还包含大量 jquery-ui 脚本。所以我走了那条路，但没有使用他们的句柄来调用他们。

我做错了什么？

        wp_enqueue_script('jquery-core');
        //wp_register_script( 'jquery-core', get_template_directory_uri() . '/js/jquery.ui.core.min.js', array( 'jquery' ));
        wp_enqueue_script('jquery-ui-core');
        //wp_register_script( 'jquery-draggable', get_template_directory_uri() . '/js/jquery.ui.draggable.min.js', array( 'jquery' ));
        wp_enqueue_script('jquery-ui-draggable');
        //wp_register_script( 'jquery-droppable', get_template_directory_uri() . '/js/jquery.ui.droppable.min.js', array( 'jquery' ));
        wp_enqueue_script('jquery-ui-droppable');
       // wp_register_script( 'jquery-mouse', get_template_directory_uri() . '/js/jquery.ui.mouse.min.js', array( 'jquery' ));
        wp_enqueue_script('jquery-ui-mouse');
       // wp_register_script( 'jquery-sortable', get_template_directory_uri() . '/js/jquery.ui.sortable.min.js', array( 'jquery' ));
        wp_enqueue_script('jquery-ui-sortable');
        //wp_register_script( 'jquery-widget', get_template_directory_uri() . '/js/jquery.ui.widget.min.js', array( 'jquery' ));
        wp_enqueue_script('jquery-ui-widget');

目前我的 register_script 函数调用已注释掉，当我添加 enqueue_script 以通过其句柄调用它时它确实有效，但控制台向我抛出了有关这些文件的错误（从 jquery-ui 下载）我认为它的 bc jquery 是未被识别，因此有关 $ 的错误未定义。

如果我首先使用 wp_register_script 调用脚本，它实际上会加载，但会引发很多指向 jquery-ui 库的控制台错误。最后一个错误实际上是我的代码 $(...).accordion();不是函数。我从一个 jquery-ui 演示中提取了这段代码。我可以在 jsfiddle 中对我的 jquery-ui 构建进行单元测试，一切都很好。我没有在那里手动调用 jquery-ui 库，因为它们有一个下拉列表可以选择它，但是我放入的 html 和 js 演示代码。

有什么想法吗？

Answer 1

$未定义的错误是因为jQuery在WP中以无冲突模式加载。

替换：

$(document).ready(function(){

与：

jQuery(document).ready(function($){

还只是为了确保您的 PHP 在带有 enqueue scripts 钩子的函数中。

function wpse_load_js() {
   wp_enqueue_script('jquery-ui-core');
   wp_enqueue_script('jquery-ui-draggable');   
   wp_enqueue_script('jquery-ui-droppable');      
   wp_enqueue_script('jquery-ui-mouse');
   wp_enqueue_script('jquery-ui-sortable');
   wp_enqueue_script('jquery-ui-widget');
}
add_action( 'wp_enqueue_scripts', 'wpse_load_js' );