如何在点击时显示工具提示

Question

我正在尝试使用qtip2.我的问题是我只想在用户点击href内部指定的html 时显示工具提示.所以我试试这个:

function help(){
    var link = document.getElementById('helps');
    if(link.innerHTML=="Open"){
        $('#helps').qtip({
           content: {
              text: 'I get shown on click'
           },
           show: {
              event: 'click'
           }
        });
    link.innerHTML = "Close";
    }else{
        link.innerHTML="Open";
    }
}
<a href="javascript:help()" id="helps">Open</a>

我的问题是,当我点击时,文字变为Close但工具提示不显示.当我再次单击文本时Open,我会看到工具提示.我能做什么？

Answer 1

您应该qtip在onclick处理程序之前初始化.

$('#helps').qtip({
  content: {
    text: 'I get shown on click'
  },
  show: {
    event: 'click'
  }
});

function help() {
  var link = document.getElementById('helps');
  if (link.innerHTML == "Open") {
    link.innerHTML = "Close";
  } else {
    link.innerHTML = "Open";
  }
} 

< a href = "javascript:help()" id = "helps" > Open < /a>