Question

使用jQuery UI ToolTip plug-in，如何一次显示多个工具提示？

我出现两个工具提示的原因是因为我有一个字段的信息性消息，并且可能是该字段的错误消息。

目前的HTML如下：

<li title="This is an informational ToolTip message">
  <input type="text" class="error" title="This is an error ToolTip message">
</li>

当前的JavaScript：

$('body').tooltip({
  track: true
});
$('body').tooltip({
  items: '.error',
  position: {my: 'left bottom-15', at: 'left top', collision: 'flipfit'},
  track: true
});

当前的问题是，当输入<li>时，信息工具提示正确显示，但当鼠标进入字段本身时，信息工具提示淡出并且仅显示错误工具提示。我需要同时显示两者。

Answer 1

我强迫你提问。但它太难看了。我不建议你这样做。但请提出你的想法。

这个想法是使用一个工具提示打开/关闭事件以编程方式控制其他工具提示。

请参阅jsfiddle示例：jsfiddle

   $('li').tooltip({
  track: true,
    open: function( event, ui ) {
      $('input').tooltip('open');
  },
    close: function( event, ui ) {
      $('input').tooltip('close');
  }
});
$('input').tooltip({
  items: '.error',
  position: {my: 'left bottom-15', at: 'left top', collision: 'flipfit'},
  track: true,
  open: function( event, ui ) {
      $('li').tooltip('open');
  },
    close: function( event, ui ) {
      $('li').tooltip('close');
  }

});

Answer 2

如果是我......我只是在第一个工具提示中包含错误工具提示内容底部的文字......

var i="this is INFO tooltip text"

Tooltip 1 = i

Tooltip 2 = "Error text" + i

抱歉，无法给你真正的代码，因为我不使用jquery - 只是javascript，但反正应该很简单......

Answer 3

您必须将preventDefault（）应用于li元素的OnOver侦听器。

一次显示两个jQuery UI工具提示

3 个答案: