new ContextMenu(items)
右击菜单组件类,可以使任意HTML元素响应右键菜单,支持任意层次子菜单。使用组件需引入ht-contextmenu.js
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
items |
Arrar |
<optional> |
菜单项配置, 为JSON对象 |
Methods
-
addTo(container)
-
指定右击菜单相应的 DOM 节点
Parameters:
Name Type Description container
DOM -
addViewListener(listener, scope, ahead)
-
监听视图事件,如布局、刷新等
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
ahead
Boolean <optional>
是否将当前监听器插入到监听器列表开头
-
afterHide()
-
菜单隐藏之后被调用,可以重写此方法
-
afterShow(event)
-
菜单显示之后被调用,可以重写此方法
Parameters:
Name Type Description event
Event 如鼠标事件对象
-
beforeShow(event)
-
菜单显示之前被调用,可以重写此方法实现动态菜单功能
Parameters:
Name Type Description event
Event 如鼠标事件对象
-
disableGlobalKey()
-
禁用全局快捷键
-
dispose()
-
销毁此右键菜单
-
enableGlobalKey()
-
启用全局快捷键,一旦启用此选项,菜单不再使用时需要显式调用dispose销毁菜单
-
getHeight() → {Number}
-
获取布局高度
Returns:
Number -
getItemById(id) → {Object}
-
根据 id 查找菜单项
Parameters:
Name Type Description id
String 要查找的 id
Returns:
Object -菜单项对象
-
getItemByProperty(property, value) → {Object}
-
查找属性名为property,值为value的菜单项,只返回第一个查找结果,注意:如果菜单显示时修改此查找结果,则菜单界面在下次显示时更新
Parameters:
Name Type Description property
String 属性名
value
Object 菜单项
Returns:
Object -菜单项对象
-
getRelatedView() → {HTMLDivElement}
-
获取右击菜单组件响应的 dom
Returns:
HTMLDivElement -
getView() → {HTMLDivElement}
-
获取组件的根层div
Returns:
HTMLDivElement -
getWidth() → {Number}
-
获取布局宽度
Returns:
Number -
hide()
-
隐藏菜单
-
invalidate(delay)
-
无效组件,并调用延时刷新
Parameters:
Name Type Description delay
Number 延迟刷新的间隔事件(单位:ms)
- See:
-
isDisabled() → {Boolean}
-
组件是否处于不可用状态,处于此状态时不能进行任何操作并且会遮挡一层蒙板
Returns:
Boolean -
isShowing() → {Boolean}
-
组件是否处于可见状态
Returns:
Boolean -
iv(delay)
-
无效组件,并调用延时刷新,invalidate的缩写
Parameters:
Name Type Description delay
Number 延迟刷新的间隔事件(单位:ms)
- See:
-
setDisabled(value, iconUrl)
-
设置组件是否处于不可用状态,处于不可用状态时不能进行任何操作并且会遮挡一层蒙板
Parameters:
Name Type Attributes Description value
Boolean 是否禁用组件
iconUrl
String <optional>
蒙板上显示的icon的路径
-
setHeight(v)
-
设置布局高度
Parameters:
Name Type Description v
Number 高度值
-
setItems(items)
-
设置菜单项,参数为JSON对象
Parameters:
Name Type Description items
Array 菜单项配置数组
Example
//参数示例: [{ label: '', //菜单文字 icon: '', //菜单图片ICON type: "check" | "radio", //可多选的菜单项 | 单选菜单项 groupId: 1 //菜单项分组, 当 type 为 radio 有用 disabled: true //禁用菜单项,可以是函数,由返回值决定是否禁用 href: "http://www.hightopo.com", //超链到某个URL linkTarget: "_blank", //超链目标,默认_self key: [Key.ctrl, Key.enter], //实际响应的快捷键 suffix: "Ctrl+Enter", //在菜单上显示的提示文字 preventDefault: false, //是否阻止快捷键默认的行为,默认为true visible: true, //是否可见,可为 boolean,也可以是 function }]
-
setItemVisible(id, visible)
-
设置指定 id 的菜单项是否可见
Parameters:
Name Type Description id
String 菜单项id
visible
Boolean 是否可见
-
setLabelMaxWidth(maxWidth)
-
设置菜单中label的最大宽度,如果label过长会出现跑马灯效果
Parameters:
Name Type Description maxWidth
Number 最大宽度
-
setVisibleFunc(func)
-
设置可见过滤器
Parameters:
Name Type Description func
function 过滤器函数
-
setWidth(func)
-
设置布局宽度
Parameters:
Name Type Description func
function 过滤器函数
-
show(x, y, mouseOffset)
-
显示菜单, x,y为菜单显示页面在中的坐标
Parameters:
Name Type Attributes Description x
Number | Event x坐标,当仅有一个参数可以传入鼠标事件
y
Number <optional>
y坐标
mouseOffset
Boolean <optional>
是否默认相对传入位置偏移
-
showOnView(view, x, y)
-
在对应组件上显示菜单
Parameters:
Name Type Attributes Description view
DOM 组件,可以是 DOM 或者 ht 组件
x
Number | Event x坐标,当仅有二个参数可以传入鼠标事件
y
Number <optional>
y坐标
-
validate()
-
立刻刷新组件