qTip jQuery插件并不总是被激活

我正在使用qTip jquery插件qTip插件为我正在研究的网站基于我在这里提出的另一个线程： 堆栈溢出线程

我的问题是，我的屏幕顶部有一个导航栏，它基本上根据你所在的标签菜单设置标题属性，这些都存储在一个javascript数组中。

例如，我在屏幕顶部有三个菜单选项，例如菜单A，菜单B和菜单C.

我还有一个信息图像位于导航栏的最右边位置，我根据导航栏中选择的菜单选项设置了标题属性。

例如：

Menu A => myRole[0] = "Admin" Menu B => myRole[1] = "Manager" Menu C => myRole[2] = "Guest" 

因此，基本上当用户点击导航栏中的每个菜单时，我将信息图像中的title属性设置为“Admin”，“Manager”或“Guest”。

在启动时，qTip插件工作并在我将鼠标hover在其上时显示“Admin”但是当我将菜单更改为菜单C时，它仍显示“Admin”而不是“Guest”

从它的外观来看，它似乎并没有调用qTip插件，我已经将其定位在屏幕的页脚（参见下面的实际代码）。

任何想法如何确保每次点击/更改javascript数组中的菜单选项和拾取值时qTip都会触发？

   $(document).ready(function() { $('div#infoi img[title]').qtip({ position: { adjust: { x:-110, y:0 }, corner: { target: 'bottomLeft', tooltip: 'topMiddle' } }, style: { width: 250, padding: 5, background: '#E7F1FA', color: 'black', textAlign: 'center', border: { width: 3, color: '#65a9d7' }, tip: 'topRight' } }); });  

谢谢。

Answer 1

如果您的菜单在页面上存在，然后您稍后添加其他元素或稍后替换元素，则需要在该元素上重新初始化工具提示。

正如您所提到的，您似乎只是根据选择更改侧面部分的文本。 您需要更改两个标题然后重新初始化qtip函数，所以我建议您将所有代码放在像这样的函数中

  var qtipset = function（）{
       $（'div #infoi img [title]'）。qtip（{
      职位：{ 
         调整：{x：-110，y：0}，
         角落：{
            目标：'bottomLeft'，
            工具提示：'topMiddle'
          }
       }，
      风格：{
        宽度：250，
        填充：5，
        背景：'＃E7F1FA'，
        颜色：'黑色'，
         textAlign：'center'，
        边界： {
          宽度：3，
          颜色：'＃65a9d7'
         }，
        提示：'topRight'
       }
    }）;
      } 

在您的Javascript中，您正在更改图像上的title属性后，使用所选菜单文本更新图像的标题，也可以调用此函数，如qtipset(); 然后重新读取标题并初始化页面上的qtip元素，以便下次hover时它将能够使用正确的数据调用qtip函数。