禁用 wordpress 自带 jquery-禁用 TablePress 插件加载的 jQuery 以解决和 WordPres

文章目录

昨天修改了一个网站的配置，换成了一个大型前端DUX主题。不得不说DUX真的很美。然后我发现TablePress在某些页面上时，WordPress主题的一些侧边栏和搜索按钮不起作用。我仔细查看了网页源代码，发现TablePress带来了两个以上的JS文件，其中一个jQuery文件是重复的。加载完毕，F12查看控制台，确实是jQuery报错。那么问题就很简单了，禁用TablePress加载的额外jQuery即可。

如下图，多了两个JS文件，里面的jQuery和主题自带的jQuery文件冲突。

1.尝试禁用WordPress自带的jQuery的加载

我想到的第一个解决方案当然是禁止 WordPress 加载自己的 jQuery。网上查了一些方法，总结一下是这样的：

方法一：

//禁止加载默认jq库
function my_enqueue_scripts() {
wp_deregister_script('jquery');
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts', 1 );

方法二：

//
if ( !is_admin() ) { // 后台不禁止
function my_init_method() {
wp_deregister_script( 'jquery' ); // 取消原有的 jquery 定义
}
add_action('init', 'my_init_method');
}
wp_deregister_script( 'l10n' );

将上述代码添加到当前主题函数模板文件的最后一个“?>”。上述方法来自：《禁用WordPress自带的jquery库的加载》。

但是尝试了很多次，也尝试了网上类似的方法，发现没有效果。 jQuery 在不应该加载的时候还在加载，所以我把问题的关键转向了插件本身。

当然，还有其他方法，例如“与 WordPress 中的 jQuery 库不工作相关的问题”，但在这里没有效果。

2.禁用TablePress加载jQuery

我下载了整个插件后，搜索了jQuery禁用 wordpress 自带 jquery，发现了下面这行代码（文件位置：tablepress/controllers/controller-frontend.php）：

于是我查看了WordPress参考函数，发现这个函数的使用方式是这样的（代码参考）：

wp_enqueue_script( string $handle, string $src = '', array $deps = array(),string|bool|null $ver = false, bool $in_footer = false )

这里 array$deps=array() 的意思是：

(array) (Optional) An array of registered script handles this script depends on.
Default value: array()

也就是说，要加载这个脚本禁用 wordpress 自带 jquery，就需要依赖这个array()里的脚本，而TablePress这里写的是依赖jQuery，所以每次加载TablePress的jquery.datatables.min.js之前，都会加载jQuery 。这就是现在问题的关键。

知道问题所在后，只需将上面这行代码修改为以下内容即可：

wp_enqueue_script( 'tablepress-datatables', $js_url, array(), TablePress::version, true );

也就是说，它不依赖于jquery-core脚本。毕竟，DUX 主题已经附带了 jQuery。

修改后发现问题确实解决了。

相关文章