在这篇文章中，我们将讨论如何使用 jQuery 和 HTML 而不是插件来创建工具提示，以获得更轻松的方法。
背景
最近，我正在经历一个为我的网格创建工具提示的情况。众所周知，有很多插件可用于生成工具提示。但我想手动创建它们。
使用代码
首先，我们将创建一个页面和一个 HTML 表格。
<!DOCTYPE html>
<html>
<head>
<title>Create Tooltip Without Any Plugins</title>
<script src="jquery-2.0.2.min.js"></script>
</head>
<body>
<table class="table" border="1" style="width: 100%">
<tr>
<td>Sibi</td>
<td>Ajay</td>
<td>50</td>
</tr>
<tr>
<td>Ansu</td>
<td>Akhil</td>
<td>94</td>
</tr>
<tr>
<td>Shanto</td>
<td>Libin</td>
<td>80</td>
</tr>
</table>
</body>
</html>
现在，如果您运行您的页面，您可以看到该表。现在，我们将把我们的脚本添加到页面中。
<!DOCTYPE html>
<html>
<head>
<title>Create Tooltip Without Any Plugins</title>
<script src="jquery-2.0.2.min.js"></script>
</head>
<body>
<table class="table" border="1" style="width: 100%">
<tr>
<td>Sibi</td>
<td>Ajay</td>
<td>50</td>
</tr>
<tr>
<td>Ansu</td>
<td>Akhil</td>
<td>94</td>
</tr>
<tr>
<td>Shanto</td>
<td>Libin</td>
<td>80</td>
</tr>
</table>
</body>
</html>
这里我们所做的是在 mouseover 事件中为
<td>
元素附加 title 属性。
完整代码
<!DOCTYPE html>
<html>
<head>
<title>Create Tooltip Without Any Plugins</title>
<script src="jquery-2.0.2.min.js"></script>
</head>
<body>
<table class="table" border="1" style="width: 100%">
<tr>
<td>Sibi</td>
<td>Ajay</td>
<td>50</td>
</tr>
<tr>
<td>Ansu</td>
<td>Akhil</td>
<td>94</td>
</tr>
<tr>
<td>Shanto</td>
<td>Libin</td>
<td>80</td>
</tr>
</table>
</body>
</html>
结论
我是否遗漏了您认为需要的任何内容？你在编程生活中遇到过这个问题吗？我希望你喜欢这篇文章。请分享您宝贵的建议和反馈。
到你了。你怎么认为？
博客不是没有评论的博客，但请尽量切题。如果您有与本文无关的问题，最好将其发布到 C# 角、代码项目、Stack Overflow、Asp.Net 论坛，而不是在这里发表评论。发推文或通过电子邮件将您的问题链接发送给我，如果可以的话，我一定会尽力提供帮助。