javascript - 在同一元素上显示多个工具提示

Question

我尝试将工具提示放在一个元素上，该元素根据同一页面上的四个按钮而变化。

a.tooltip span {            
  z-index:15;
  position: relative;
  display:none;
  padding:14px 20px;
  margin-top:17.5%;
  margin-left:18%;
  width:300px;
  height:80px;
  line-height:16px;
  border-radius:2px;        
  box-shadow: 0px 0px 6px 3px #666;
  opacity: 0.8;
}

a.tooltip:hover span{
  display:inline;
  position:absolute; 
  border:2px solid #666;
  color:black;
  background:white repeat-x 0 0;
}

这是我的工具提示。我工作得很好，但是当我想要显示另一个工具提示时，我无法隐藏它。

如何根据我单击的按钮禁用此工具提示并显示另一个工具提示？显示 Tooltip2 时必须隐藏 Tooltip1，反之亦然。

博士。 Google 没有帮助。

澄清图片:

Answer 1

您可以更改工具提示内容

 $(".tooltip-selector").tooltip("option", "content", "New Content");

并将其绑定(bind)到您的按钮点击