使用须知
如何开始
安装
全局元素
样式重置
文字
颜色
徽章
提示框
表格
图标
栅格
原生组件
Panel
Accordion
Tabs
Layout
DataGrid
DataList
PropertyGrid
Tree
TreeGrid
LinkButton
Menu
MenuButton
SplitButton
SwitchButton
TabButton
Pagination
ProgressBar
SearchBox
Form
CheckBox
RadioBox
TextBox
PasswordBox
FileBox
TagBox
Combo
ComboBox
ComboGrid
ComboTree
ComboTreeGrid
ComboFilter
NumberBox
NumberSpinner
Calendar
DateBox
DateRangeBox
DateTimeBox
DateTimeRangeBox
TimeSpinner
DateTimeSpinner
Slider
ValidateBox
ImagesBox
Window
Dialog
Messager
Draggable
Droppable
Resizable
Tooltip
MaskedBox
扩展组件
头像
上传
时间轴
聊天
用户面板
消息面板
统计数据面板
Echart面板
圆形统计图
评论
相册
评分
文件
滚动条
二维码
条形码
天气
AT
编辑器
课程表
日程表
项目管理
客户管理
浏览器
FAQ
兼容插件
IconFont
Font Awesome
Ueditor
Ckeditor
Echarts
Plupload
Cropper
BaiduMap
AMap
Colpick
Nprogress
Gantt
GanttEditor
Raty
WebUploader
匿名
匿名 您还未登录

Tooltip

Document
Native
Basic
Position
Custom Content
Custom Style
Ajax Tooltip
Tooltip Dialog
Tooltip as Toolbar
Plus
Extend

Tooltip Document

使用$.fn.tooltip.defaults重写默认值对象。(译者注:1.3.3版中新增的plugin)
当用户将鼠标移动到元素上的时候,将会显示一个消息提示框。提示框的内容可以是页面中任何一个HTML元素或者通过Ajax发送后台请求以获取提示框内容。

文档汉化:

汉化人:王锦阳
汉化语言:简体中文
个人博客:http://blog.sina.com.cn/richie696

依赖关系:

用法:

1. 通过标签创建提示框,给元素添加一个"easyui-tooltip"的类名,无需任何Javascript代码。

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

2. 通过Javascript创建提示框。

				
<a id="dd" href="javascript:void(0)">Click here</a>
<script type="text/javascript">
$('#dd').tooltip({    
    position: 'right',    
    content: '<span style="color:#fff">This is the tooltip message.</span>',    
    onShow: function(){        
        $(this).tooltip('tip').css({            
        backgroundColor: '#666',            
        borderColor: '#666'        
        });    
    }
});
</script>
				
			

属性:

属性名 属性值类型 描述 默认值
position string 消息框位置。可用值有:"left","right","top","bottom" bottom
content string 消息框内容。 null
trackMouse boolean 为true时,允许提示框跟着鼠标移动。 false
deltaX number 水平方向提示框的位置。 0
deltaY number 垂直方向提示框的位置。 0
showEvent string 当激发什么事件的时候显示提示框。 mouseenter
hideEvent string 当激发什么事件的时候隐藏提示框。 mouseleave
showDelay number 延时多少秒显示提示框。 200
hideDelay number 延时多少秒隐藏提示框。 100

事件:

事件名 参数 描述
onShow e 在显示提示框的时候触发。
onHide e 在隐藏提示框的时候触发。
onUpdate content 在提示框内容更新的时候触发。
onPosition left,top 在提示框位置改变的时候触发。
onDestroy none 在提示框被销毁的时候触发。

方法:

方法名 方法属性 描述
options none 返回控件属性对象。
tip none 返回tip元素对象。
arrow none 返回箭头元素对象。
show e 显示提示框。
hide e 隐藏提示框。
update content 更新提示框内容。
reposition none 重置提示框位置。
destroy none 销毁提示框。