如何使用jQuery禁用WordPress中的Tooltipster组件

为什么你之前的方法无效？ #

disabled 属性仅针对表单元素（如按钮、输入框）生效，对 <div> 这类普通DOM元素完全不起作用。而且Tooltipster的功能是通过自身JavaScript实例控制的，直接操作DOM元素无法彻底禁用它的后台逻辑。

方法1：销毁Tooltipster实例（推荐） #

Tooltipster提供了官方销毁方法，能彻底移除提示框的所有功能（包括事件监听、DOM生成逻辑）：

jQuery(document).ready(function($) {
  // 销毁页面上所有Tooltipster实例
  $('.tooltipstered').tooltipster('destroy');

  // 若只需禁用特定元素的提示框，替换为目标选择器即可
  // $('#specific-element').tooltipster('destroy');
});

说明：.tooltipstered是Tooltipster自动添加到绑定了提示框的元素上的类，调用destroy后，相关元素将不再触发提示框。

方法2：阻止Tooltipster初始化 #

如果提示框是插件动态初始化的，可以直接覆盖其初始化方法，从根源阻止它运行：

jQuery(document).ready(function($) {
  // 替换Tooltipster方法，使其无法初始化
  $.fn.tooltipster = function() {
    return this;
  };
});

方法3：移除事件监听并删除DOM #

如果上述方法无效，可手动移除Tooltipster绑定的事件，并彻底删除已生成的提示框DOM：

jQuery(document).ready(function($) {
  // 移除目标元素上的Tooltipster相关事件
  $('.tooltipstered').off('mouseenter mouseleave focus blur');
  // 彻底删除已生成的提示框DOM（而非仅隐藏）
  $('.tooltipster-base').remove();
});

注意事项 #

• 确保你的代码在Tooltipster的JavaScript文件之后加载，可将代码放在主题的footer.php末尾，或者通过WordPress的wp_enqueue_script函数设置依赖为jquery和Tooltipster的脚本（若知道其注册句柄）。
• 不建议直接修改插件代码禁用提示框，因为插件更新后修改会被覆盖。

内容的提问来源于stack exchange，提问作者omar