[smartMenu.js] 一个基于jquery的实用的右键拓展菜单栏插件

正在为电子书阅读器添加精准易用的标记功能，其中一个方案是扩展阅读器界面的右键菜单栏，使得用户右键点击某个词、子句、段落的时候可以进行扩展操作。

右键菜单栏有很多基于jQuery的插件，其中灵活性比较强、易用、可扩展的一个是smartMenu.js（github有不少重名库，本插件来自：www.zhangxinxu.com）

用法：

$(document.getElementById(id).contentWindow.document.body).find('.word').smartMenu(data,{
　　offsetX:120,
　　offsetY:120,
　　textLimit:12,
});

其中document.getElementById(id).contentWindow.document.body是jquery的选择器部分，将搜索范围限制在阅读器iframe窗体中查找元素。

smartMenu是该插件的方法，用来为jQuery对象添加右键菜单栏，其中data参数是由菜单项组成的数组，第二个json参数是配置选项，其API如下：

参数名	默认值	相关说明
name	""	字符串。上下文菜单的名称，用以区分不同的上下文菜单。如果页面只有一个上下文菜单，此参数可缺省；如果是多个菜单，此参数必须，否则菜单会出现冲突。
offsetX	2	数值。上下文菜单左上角距离鼠标水平偏移距离。
offsetY	2	数值。上下文菜单左上角距离鼠标垂直偏移距离。
textLimit	6	数值。上下文菜单项限制显示的文字个数。如果超出会截取，并以…补全，完成文字以title形式显示。
beforeShow	$.noop	函数。菜单即将显示之前执行的回调函数。$.noop为jQuery 1.4+版本支持，所以，如果你想让插件向下兼容，可设置将插件js中所有的$.noop替换成function() {}
afterShow	$.noop	函数。菜单显示后执行的回调函数。

 offsetX和offsetY如果不设置，则右键单击元素后，菜单栏在鼠标左上角较远处弹出，设置为120的效果如下：

还可以使用beforeShow和afterShow函数进行更复杂的操作。

 

转载于:https://www.cnblogs.com/xiaozhaoqi/p/7878857.html