《基于js代码实现当鼠标悬停表格上显示这一格的全部内容.doc》由会员分享，可在线阅读，更多相关《基于js代码实现当鼠标悬停表格上显示这一格的全部内容.doc（5页珍藏版）》请在金锄头文库上搜索。
1、基于JS代码实现当鼠标悬停表格上显示这一格的全部内容想实现这样一个功能，就是在一个表格中，由于很多字过多，所以用文字溢出的方法处理了，但是这样就无法看到表格中具体的内容呢。想实现当鼠标移上去的时候可以显示这一行被隐藏的内容。当然这个网上有很多插件，但是我没有用，还是自己写了一个。css部分#showbox width: 150px;min-height: 50px;font: 100 14px/1 微软雅黑;border: 1px solid #3c8dbc;display: none;position: absolute;top: 0;left: 0;background-color: #f
2、ff;padding: 5px;html部分序号名称类别单位成果要求进展最新进展更新时间1阿拉蕾阿拉蕾阿拉蕾阿拉蕾阿拉蕾2阿拉蕾阿拉蕾阿拉蕾阿拉蕾阿拉蕾3阿拉蕾阿拉蕾阿拉蕾,阿拉蕾js部分$(function function showBox(obj,box)var timer = null;$(obj).on(mouseover, function (e) clearTimeout(timer);var clientX = e.clientX;var clientY = e.clientY;var txt = $(this).text ;timer = setTimeout(function
3、 console.log(clientX, clientY);$(box).css(left, clientX).css(top, clientY);if (txt = ) $(box).hide ; else $(box).show ;$(box).html(txt);, 1000););$(obj).on(mouseout,function clearTimeout(timer);$(box).hide ;);showBox(#example1 tbody td,#showbox););最后，其实bootstrap里面有个组建可以显示里面的内容，只是显示的是title，一开始不会改没用那个，后经人点醒，可以直接给title赋值，就是给title赋值为表格里面的text就好。以上所述是给大家介绍的基于JS代码实现当鼠标悬停表格上显示这一格的全部内容，希望对大家有所帮助
