如何卸载新 WooCommerce 2.3.x 加载的 select2 脚本/样式？

Posted 2023-02-22

【中文标题】如何卸载新 WooCommerce 2.3.x 加载的 select2 脚本/样式？

【英文标题】：How to unload select2 script/styles loaded by new WooCommerce 2.3.x?

【发布时间】：2015-04-17 07:52:38

【问题描述】：

我们是主题开发人员，我们已经在我们的 wordpress 主题中为 html 中的 SELECT 框使用 select2 (http://select2.github.io/) 脚本。 刚刚发布的新 WooCommerce 2.3.x 现在也使用 select2 脚本。但是它们以许多不同的方式用自己的样式（最重要的是带有 !important 标签）覆盖了它的样式。

我们不能用 !important 规则重新声明他们所有的 CSS 更改，这将是很多我们不喜欢的 CSS 混乱。现在我们的 JS 脚本也加载了 2 次并且有时也会发生冲突（因为 woocommerce 加载了自己的 select2 js）。

我的问题是在我们的主题功能中停用 woocommerce select2 CSS 和 JS 文件的最佳方法是什么？我们想使用我们的脚本版本和样式文件（也适用于 woocommerce 选择元素）。

我尝试使用 wp_dequeue_script、wp_deregister_script 和可用于样式的相同函数，但这无济于事。正如我所见，woocommerce 在我们的主题已经初始化之后添加脚本/css，我们无法停用它。

谢谢。

这是加载在 /includes/class-wc-frontend-scripts.php 中的代码，我需要从主题功能中禁用它：

self::register_script( 'select2', $assets_path . 'js/select2/select2' . $suffix . '.js', array( 'jquery' ), '3.5.2' );
self::enqueue_script( 'select2' );
wp_enqueue_style( 'select2', $assets_path . 'css/select2.css' );

如何在主题功能中卸载此 CSS/JS 文件，而不更改原始 WooCommerce 文件？

【参考方案1】：

我找到了解决办法：

add_action( 'wp_enqueue_scripts', 'mgt_dequeue_stylesandscripts', 100 );

function mgt_dequeue_stylesandscripts() 
    if ( class_exists( 'woocommerce' ) ) 
        wp_dequeue_style( 'select2' );
        wp_deregister_style( 'select2' );

        wp_dequeue_script( 'select2');
        wp_deregister_script('select2');

     
 

【参考方案2】：

最近对 WooCommerce (v 3.2.1) 进行了一些更改，其中他们派生了 select2 脚本，因此@Dmitry 上面的代码不再起作用。对我有用的新代码如下..

add_action( 'wp_enqueue_scripts', 'agentwp_dequeue_stylesandscripts', 100 );

function agentwp_dequeue_stylesandscripts() 
    if ( class_exists( 'woocommerce' ) ) 
    wp_dequeue_style( 'selectWoo' );
    wp_deregister_style( 'selectWoo' );

    wp_dequeue_script( 'selectWoo');
    wp_deregister_script('selectWoo');

   

【参考方案3】：

适用于任何重复选择字段的人。由于 Woocommerce 调用以下地址，似乎存在问题：

?wc-ajax=update_order_review

页面加载后，在每个 select 元素之后引入一个 select2 元素：

<span class="select2 select2-container ... >

此范围显示在下拉列表下方，包含当前选择的选项。

Duplicate dropdown element

我尝试在他的代码中添加wp_dequeue_script( 'wc-checkout' );，这确实阻止了跨度出现，但也阻止了其他需要的功能。

最后，我用css隐藏了span：

.woocommerce-checkout .select2-container 
    display:none;

【参考方案4】：

这里有一个可能有助于或提供前进方向的要点：https://gist.github.com/gregrickaby/2846416

还可以查看 includes/class-wc-frontend-scripts.php 以了解脚本是如何排队的。

我已从以下 URL 复制了粘贴在下面的代码，该 URL 显示了如何使单个样式出队，这也可能有所帮助：http://docs.woothemes.com/document/disable-the-default-stylesheet/

// Remove each style one by one
add_filter( 'woocommerce_enqueue_styles', 'jk_dequeue_styles' );
function jk_dequeue_styles( $enqueue_styles ) 
    unset( $enqueue_styles['woocommerce-general'] ); // Remove the gloss
    unset( $enqueue_styles['woocommerce-layout'] ); // Remove the layout
    unset( $enqueue_styles['woocommerce-smallscreen'] ); // Remove the smallscreen optimisation
    return $enqueue_styles;
 

【讨论】：

不幸的是，这个过滤器只允许禁用这 3 种样式（通用、布局和小屏幕），并且不允许禁用 WooCommerce 加载的任何其他 CSS 文件。在包含/class-wc-frontend-scripts.php 的 WooCommerce 中没有其他可用的过滤器。我在原始帖子中添加了代码，我需要禁用它。