API Docs for: 0.2
Show:

JC.Tips Class

Tips 提示信息类
显示标签的 title/tipsData 属性 为 Tips 样式

导入该类后, 页面加载完毕后, 会自己初始化所有带 title/tipsData 属性的标签为 Tips效果的标签
如果要禁用自动初始化, 请把静态属性 Tips.autoInit 置为 false

注意: Tips 默认构造函数只处理单一标签
, 如果需要处理多个标签, 请使用静态方法 Tips.init( _selector )

require: jQuery , JC.common

JC Project Site | API docs | demo link

可用的 html attribute

tipsinitedcallback: function
初始完毕时的回调
tipsshowcallback: function
显示后的回调
tipshidecallback: function
隐藏后的回调
tipstemplatebox: selector
指定tips的显示模板
tipsupdateonce: bool
tips 内容只更新一次, 这个属性应当与 tipstemplatebox同时使用

Constructor

JC.Tips

(
  • _selector
)

Parameters:

  • _selector Selector | String

    要显示 Tips 效果的标签, 这是单一标签, 需要显示多个请显示 Tips.init 方法

Example:

       <script src="../../../lib.js"></script>
       <script src="../../../config.js"></script>
       <script>
           requirejs( [ 'JC.Tips' ], function(){
               //默认是自动初始化, 也就是只要导入 JC.Tips 就会自己初始化 带 title/tipsData 属性的标签
               //下面示例是手动初始化
               JC.Tips.autoInit = false;
               JC.Tips.init( $( 'a[title]' ) ); 
           });
       </script>

Item Index

Properties

Methods

_init

() private

初始化 Tips 内部属性

data

()

获取 tips 显示的内容

Returns:

string

getInstance

(
  • _selector
  • _ins
)
static

从 selector 获得 或 设置 Tips 的实例

Parameters:

  • _selector Selector
  • _ins TipsInstance

Returns:

TipsInstance

hide

()

隐藏 Tips

Returns:

TipsInstance

hide

() static

隐藏 Tips

init

(
  • _selector
)
static

批量初始化 Tips 效果

Parameters:

  • _selector Selector

    选择器列表对象, 如果带 title/tipsData 属性则会初始化 Tips 效果

Example:

       <script src="../../../lib.js"></script>
       <script src="../../../config.js"></script>
       <script>
           requirejs( [ 'JC.Tips' ], function(){
               JC.Tips.autoInit = false;
               JC.Tips.init( $( 'a' ) ); 
           });
       </script>

layout

(
  • _update
)

获取 tips 外观的 选择器

Parameters:

  • _update Bool

    是否更新 Tips 数据

Returns:

selector

on

(
  • _evtName
  • _cb
)

使用 jquery on 绑定事件

Parameters:

Returns:

TipsInstance

selector

()

获取 显示 tips 的触发源选择器, 比如 a 标签

Returns:

selector

show

(
  • _evt
)

显示 Tips

Parameters:

  • _evt Event | Object

    _evt 可以是事件/或者带 pageX && pageY 属性的 Object
    pageX 和 pageY 是显示位于整个文档的绝对 x/y 轴位置

Returns:

TipsInstance

titleToTipsdata

(
  • _selector
)

把 tag 的 title 属性 转为 tipsData

注意: 这个方法只有当 Tips.autoInit 为假时, 或者浏览器会 IE时才会生效
Tips.autoInit 为真时, 非IE浏览器无需转换
如果为IE浏览器, 无论 Tips.autoInit 为真假, 都会进行转换
方法内部已经做了判断, 可以直接调用, 对IE会生效 , 这个方法的存在是因为 IE 的 title为延时显示, 所以tips显示后, 默认title会盖在tips上面

Parameters:

  • _selector Selector

    要转title 为 tipsData的选择器列表

trigger

(
  • _evtName
)

使用 jquery trigger 绑定事件

Parameters:

Returns:

TipsInstance

Properties

_model

private

数据模型类实例引用

_view

private

视图类实例引用

autoInit

Bool static

页面加载完毕后, 是否自动初始化

Default: true

maxWidth

Int static

Tips 的最大宽度

Default: 400

minWidth

Int static

Tips 的最小宽度

Default: 200

offset

Point object static

设置 Tips 超过边界的默认偏移像素

bottom: 边界超过屏幕底部的偏移
left: 边界低于屏幕左侧的偏移
top: 边界低于屏幕顶部的偏移

Default: { 'bottom': { 'x': 15, 'y': 15 }, 'left': { 'x': -28, 'y': 5 }, 'top': { 'x': -2, 'y': -22 } };

tpl

String static

用户自定义模板
如果用户显式覆盖此属性, Tips 会使用用户定义的模板

Default: null

Events

TipsBeforeShow

tips 显示前的回调
在HTML属性定义回调 tipsbeforeshowcallback="function name"

TipsHide

tips 隐藏后的回调
在HTML属性定义回调 tipshidecallback="function name"

TipsInited

tips 初始化实例后的触发的事件
在HTML属性定义回调 tipsinitedcallback ="function name"

TipsShow

tips 显示后的回调
在HTML属性定义回调 tipsshowcallback="function name"