Question

我正在使用tablefilter.js在HTML表格顶部生成下拉列表。在几个表行中，我有一个跨度作为悬停的工具提示，因此除非鼠标悬停在它上面，否则它不会显示。

<td>
  <a class="tooltip" href="#" id="color">Red
    <span>
      <strong>Favorite Color</strong><br />
        If this is not your favorite color,
        please make changes on this page.
    </span>
  </a>
</td>

问题是列顶部的下拉文本包含范围，因此当用户点击下拉菜单时，它会显示“红色收藏颜色如果不是......”而不是简单地“红色”。 “

有没有办法阻止tablefilter插件在初始锚点“Red？”后抓取任何内容？

这是工具提示的CSS：

a.tooltip {
  outline:none;
  text-decoration:none;
}

a.tooltip strong {
  line-height:30px;
}

a.tooltip span {
  display:none;
  line-height:16px;
  margin-left:28px;
  margin-top:-30px;
  padding:14px 20px;
  width:240px;
  z-index:10;
}

a.tooltip:hover span {
  border:1px solid #DCA;
  background:#fffAF0;
  color:#111;
  display:block;
  position:absolute;
}

.callout {
  border:0;
  left:-12px;
  position:absolute;
  top:30px;
  z-index:20;
}

a.tooltip span
{
    border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
}

Answer 1

我通常使用列表进行下拉列表。似乎红色这个词在元素之外。也许在

标签内放置“红色”这个词？或者在a.tooltip后悬停在你的CSS中的逗号：hover，span {

使用TableFilter，如何更改下拉列表中的文本？

1 个答案: