当没有给出“title”属性时,工具提示javascript会破坏以下表单元素

时间:2012-06-29 02:13:51

标签: forms tooltip javascript

我正在使用jqueryTOOLS提供的javascript工具提示在表单中提供工具提示。

对于某些不需要工具提示的表单元素,我想将标题字符串留空,但是如果我这样做,那么它会导致表单后续元素中断 - 几乎就像它将它们视为工具一样提示:在鼠标悬停时没有标题字符串的元素会移动以下元素的位置以悬停在字段旁边,然后当不再聚焦时它会永久消失。

我的工具提示代码:

$(function() {
$("#myform :input").tooltip({
position: "center right",
offset: [-2, 10],
effect: "fade",
opacity: 0.7
  });
});

您可能已经猜到这个工具提示基于字段的'title'属性。

包括

之后
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
标题中的

希望我对事件的描述有意义!

提前感谢您提供任何帮助

2 个答案:

答案 0 :(得分:3)

我修复了一个问题,给了我同样的错误,但在不同的背景下:

我有一个包含两列的表格,两个列都包含工具提示(相应的DIV中有一个TD)。

<table>
  <tbody>
    <tr>
      <td><div class="tooltip"></div></td>
      <td><div class="tooltip"></div></td>
    </tr>
  </tbody>
</table>

在第一列中打开工具提示时,第二列TD的高度和宽度会发生变化(就像TD是工具提示一样)。

在第一列的DIV中的工具提示DIV之后添加了一个额外的空TD元素,解决了这个问题。

<table>
  <tbody>
    <tr>
      <td>
        <div class="tooltip"></div>
        <div></div> <!-- extra empty div -->
      </td>
      <td><div class="tooltip"></div></td>
    </tr>
  </tbody>
</table>

答案 1 :(得分:2)

我明白了:

触发元素已定义为所有输入,因此在缺少标题元素的情况下使用下一个作为工具提示。

只是jqueryTOOLS派对的一个错误,但是一个简单的解决方案:

替换

$("#myform :input")

$("#myform :input[title]")

希望这有助于其他人