博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
EasyUI Tooltip 提示框
阅读量:7073 次
发布时间:2019-06-28

本文共 1548 字,大约阅读时间需要 5 分钟。

转自:http://www.jeasyui.net/plugins/158.html

通过 $.fn.tooltip.defaults 重写默认的 defaults。

当用户移动鼠标指针在某个元素上时,出现提示信息窗口用来显示额外信息。提示内容可以包含任何来自页面的或者通过 ajax 生成的 html 元素。

用法

创建提示框(Tooltip)

1、从标记创建提示框(Tooltip),添加 'easyui-tooltip' class 到元素,不需要任何的 javascript 代码。

  1. <a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me</a>

2、使用 javascript 创建提示框(Tooltip)。

  1. <a id="dd" href="javascript:void(0)">Click here</a>
  1. $('#dd').tooltip({
  2. position: 'right',
  3. content: '<span style="color:#fff">This is the tooltip message.</span>',
  4. onShow: function(){
  5. $(this).tooltip('tip').css({
  6. backgroundColor: '#666',
  7. borderColor: '#666'
  8. });
  9. }
  10. });

属性

名称 类型 描述 默认值
position string 提示框(tooltip)位置。可能的值:'left'、'right'、'top'、'bottom'。 bottom
content string 提示框(tooltip)内容。 null
trackMouse boolean 如果设置为 true,提示框(tooltip)会随着鼠标移动。 false
deltaX number 提示框(tooltip)位置的水平距离。 0
deltaY number 提示框(tooltip)位置的垂直距离。 0
showEvent string 引发提示框(tooltip)出现的事件。 mouseenter
hideEvent string 引发提示框(tooltip)消失的事件。 mouseleave
showDelay number 显示提示框(tooltip)的时间延迟。 200
hideDelay number 隐藏提示框(tooltip)的时间延迟。 100

事件

名称 参数 描述
onShow e 当显示提示框(tooltip)时触发。
onHide e 当隐藏提示框(tooltip)时触发。
onUpdate content 当提示框(tooltip)内容更新时触发。
onPosition left,top 当提示框(tooltip)位置改变时触发。
onDestroy none 当提示框(tooltip)销毁时触发。

方法

名称 参数 描述
options none 返回选项(options)属性(property)。
tip none 返回提示(tip)对象。
arrow none 返回箭头(arrow)对象。
show e 显示提示框(tooltip)。
hide e 隐藏提示框(tooltip)。
update content 更新提示框(tooltip)内容。
reposition none 重置提示框(tooltip)位置。
destroy none 销毁提示框(tooltip)。

转载于:https://www.cnblogs.com/sharpest/p/9955860.html

你可能感兴趣的文章
“机器学习”相关资料分享
查看>>
Linux 多网卡设置同一网段,引发的问题
查看>>
【NetApp】snap autodelete设置
查看>>
我的友情链接
查看>>
如何添加自定义icon
查看>>
Gecko架构浅析之编码检测和转换
查看>>
Zookeeper集群的搭建与调试
查看>>
如何让你的chrome支持xmlHttp
查看>>
我的友情链接
查看>>
Composer安装配置
查看>>
redis的安全问题
查看>>
Renew DNS client registration using the ipconfig command (ipconfig /registerdns )
查看>>
更新管理员密码后,SQL不能正常启动处理方法
查看>>
我的友情链接
查看>>
win7 打印服务 Print Spooler 故障
查看>>
我的友情链接
查看>>
dpkg命令的用法
查看>>
linux学习命令总结①
查看>>
map集合分割以及多线程处理数据
查看>>
Send-MailMessage标题之乱码解决
查看>>