入队jquery-ui的正确方法

我在插件中包含jquery-ui脚本和样式时遇到了困难。看来我的wp_enqueue_script电话完全被忽略了。

已经有很多与此问题类似的问题，但是到目前为止，我发现的所有答案都归结为wp_enqueue_script在wp_enqueue_scripts动作挂钩中调用，而这已经在做了。

在类的构造函数中，我调用：

add_action( 'wp_enqueue_scripts', array($this, 'enqueue_scripts') );

然后，在下面：

public function enqueue_scripts()
{    
  wp_enqueue_script( 'jquery-ui-core', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-widget', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-mouse', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-accordion', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-autocomplete', false, array('jquery'));
  wp_enqueue_script( 'jquery-ui-slider', false, array('jquery'));

我检查了代码是否实际上在每次页面加载时都会执行。但是，页面缺少<link>jquery-ui库的标签。我已经尝试过jquery在wp_enqueue_script调用的第三个参数中显式指定的依赖性和不依赖性。

我还尝试了简单的WP 4.8安装，除了我的以外没有安装任何插件，并且仅使用默认的27个主题。没有骰子。

我的代码有什么问题？

首先，WordPress通过注册jQuery UI wp_default_scripts()。依赖关系已经设置，因此您只需要排队真正需要的脚本（而不是核心）。由于您没有更改版本号或其他任何内容，因此仅使用句柄是可以的。

// no need to enqueue -core, because dependancies are set
wp_enqueue_script( 'jquery-ui-widget' );
wp_enqueue_script( 'jquery-ui-mouse' );
wp_enqueue_script( 'jquery-ui-accordion' );
wp_enqueue_script( 'jquery-ui-autocomplete' );
wp_enqueue_script( 'jquery-ui-slider' );

至于样式表：默认情况下，WordPress不注册jQuery UI样式！

在评论中，butlerblog指出，根据《插件指南》

当不充当服务时，不允许在插件内执行外部代码，例如：

• 呼叫第三方CDN的原因不是字体包含在内；所有与服务无关的JavaScript和CSS都必须包含在本地

这意味着不允许通过CDN加载样式，并且应始终在本地完成。您可以使用来实现wp_enqueue_style()。

如果您要排队自己的脚本，则只需将'jquery-ui-accordion'例如添加到依赖项列表中。所有必需的依赖项将自动添加。例：

wp_enqueue_script( 'my-theme', get_stylesheet_directory_uri() . '/js/theme.js', array( 'jquery', 'jquery-ui-accordion' ) );

将生成以下代码：

<script type='text/javascript' src='/wp-includes/js/jquery/ui/core.min.js'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/widget.min.js'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/accordion.min.js'></script>
<script type='text/javascript' src='/wp-content/themes/theme/js/theme.js'></script>

我已经修改了您的脚本。试试这个，它正在工作。

add_action( 'wp_enqueue_scripts', array($this, 'enqueue_scripts') );
public function enqueue_scripts()
{    
  wp_enqueue_script( 'jquery-ui-core');
  wp_enqueue_script( 'jquery-ui-widget');
  wp_enqueue_script( 'jquery-ui-mouse');
  wp_enqueue_script( 'jquery-ui-accordion' );
  wp_enqueue_script( 'jquery-ui-autocomplete');
  wp_enqueue_script( 'jquery-ui-slider');
}