jQuery UI如何保持工具提示打开以进行调试（以样式化它）

Question

我想要给jQuery UI工具提示添加样式，但是它一直在关闭。我尝试了以下方法，但都没有成功：

 $("td label").tooltip({

    disabled: true,
    close: function (event, ui) { return false; }

 }).on("click", function () {

    $(this).tooltip("open");
 }).off('focusout mouseleave mouseenter');

似乎没有任何方法可以让它保持打开状态。当我右键单击去使用Firebug时，它会在我有机会之前消失。

- parliament

---

如果您没有指定这个 off('focusout mouseleave mouseenter')，会发生什么？ - TGH

不行，仍然消失了。 - parliament

Answer 1

调用您的工具提示上的 open 方法，这将使它们保持打开状态。

$("td label").tooltip().tooltip("open");

- omma2289

---

请注意，此方法仅适用于非委派工具提示。另有一种选项，请参见http://stackoverflow.com/a/14881045/7376。 - Tom

Answer 2

更好的选择是暂停js执行。

1. 打开控制台
2. 切换到“资源”选项卡
3. 悬停在某个元素上以查看工具提示
4. 点击F8按钮（可能不同，请悬停在“暂停”图标上检查热键）

- Alexander Tretyakov

---

这只是为了调试目的而给出的正确答案。不要进行任何代码修改。 - Kelly

这应该是被接受的答案，因为没有修改任何代码！ - equitharn

非常感谢，现在看起来很明显了...但我浪费了一些时间尝试调试jquery-ui的自动完成功能，它会在任何点击时消失。 - Jose Manuel Gomez Alvarez

Answer 3

如果只是为了调试目的，为什么不使用hide选项并设置一个非常长的持续时间呢？

$("td label").tooltip({ hide: {duration: 1000000 } });

- Jeemusu

---

或者使用 delay，像这样：hide: {delay: 1000000 }。 - Pang

Answer 4

在Tooltipster的v4.1.5版本中，使用delay选项即可。

$('.tooltip').tooltipster({
   interactive:true,
   animation: 'grow',
   delay:[100, 10000000]
});

第二个延迟值指定了工具提示的关闭延迟时间。参考：http://iamceege.github.io/tooltipster/#options

- Tom

Answer 5

之前的两个答案都没帮到我，一个在非委托工具提示上无法使用，而另一种方法则无法在开发面板中玩弄CSS。工具提示确实保持打开状态，但我无法取消选中任何复选框或输入更多CSS - 在实施解决方案之前找到解决方案。

最终，我使用调试器语句在打开工具提示后中断了我的代码。

示例：

jQuery(".myElement").tooltip({
    open: function (event, ui) {            
            debugger;
    }
});

当断点被触发时，在控制台中执行以下代码：

$(".ui-tooltip-content")

在控制台中右键单击评估结果，然后选择“在元素面板中显示”，就可以像处理页面上的任何其他元素一样处理它。当工具提示内容是动态构建的时（例如在我的情况下），这尤其有帮助。

- Apeksha