💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、星火、月之暗面及文生图 广告
### Tooltip(提示框) 使用$.fn.tooltip.defaults重写默认值对象。**(译者注:1.3.3版中新增的plugin)** 当用户将鼠标移动到元素上的时候,将会显示一个消息提示框。提示框的内容可以是页面中任何一个HTML元素或者通过Ajax发送后台请求以获取提示框内容。 ![](https://box.kancloud.cn/2016-07-19_578d91349f309.png) #### 使用案例 ##### 创建提示框 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> ~~~ ~~~ $('#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' }); }}); ~~~ #### 属性 | **属性名** | **属性值类型** | **描述** | **默认值** | |-----|-----|-----|-----| | 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 | 销毁提示框。 |