鼠标悬停出现提示信息怎么做

Posted 2021-03-21 shiguangshiyi

概述

提示：指启示，提起注意或给予提醒和解释。

在 excel 中会经常用到给某个格子增加提醒信息，比如金额提示输入数值或最大长度值等等。设置方式也有多种，简单的，仅为单元格插入批注就可以了，也有复杂的有效性验证方式。下图为批注方式：

另外，在网页设计中也常常看到同样功能，常见的帮助提示框（tips），鼠标悬停在帮助图标上时，显示所有的帮助信息。也不难，几行 JS 脚本的事儿。

润乾报表支持在 Web 发布，衣食父母们同样希望产品具备鼠标移动到某个位置时显示一些提示信息的功能。

润乾想客户之所想，不仅支持静态信息，也允许开发者设置动态提示信息（一个单元格，可根据条件判断显示不同信息）。

今天先入个门，介绍一下静态信息的设置方法，后续在结合合适场景介绍动态提示。

Ok！开始进入正题，润乾报表怎么设置静态提示信息呢？ 以“工资单”为例，多数人不清楚其中的考勤扣除怎么算，这里便可以为“考勤扣除”设置提示。

操作步骤

准备工资条报表模板

准备一张结果如下图所示的网格式报表

模板设计如下

注意：该例子目的是为标题字段增加提示，所以不考虑数据来源问题，第三行的数据均为固定数值。

模板中设置静态信息提示（WEB–提示）

在模板中选中 E2，属性区“WEB”—“提示”—“值”编辑框

预览报表结果

提示仅在 web 端有效，所以先发布报表，浏览器预览，当鼠标悬停在“考勤扣除”时效果如下

通过设置单元格提示，轻松做到鼠标悬停的提醒功能。如同强制分页、动态背景色等小技巧一样，针对这种比较常用的功能，报表工具在设计时都已考虑到。遇到类似问题依然建议查阅手册，对应设置即可。

另外，在后续的文章中，会结合相应场景介绍动态提示信息的设置方法，敬请关注。。。

更多前端展现效果的相关问题请查看：前端效果相关问题分类导航
* web 报表轻松实现数据异常预警功能
* 报表实时刷新显示时间
* 报表工具如何实现“点击查看原图”
* 润乾报表中进度条的一种实现方式
* 报表怎样实现滚动的公告效果？
* HTML 事件 – 鼠标移入高亮显示
* 点击表头切换升降序排序方式