jQuery实现了右键菜单插件。

当开发一个项目时,你需要一个模拟鼠标右键菜单的功能,也就是说,当你在网页上点击正确的按钮时,它不是弹出的菜单,而是我们正在做的,这可以扩展右键的功能:

js的一部分:

复制代码代码如下所示:

创建正确的菜单

无功epmenu = {

创建:函数(点,选项){

无功menunode = document.getelementbyid('epmenu);

如果(!MenuNode) {

当没有节点创建菜单时

menunode = document.createelement(div);

menunode.setattribute(' ','epmenu);

menunode.setattribute('id','epmenu);

}人(menunode美元)。Html(' '); / /空的内容



(menunode美元)。Css({左:点左+ 'px,顶部:点。顶+ 'px});

对于(选项中的var x){

无功tempnode = document.createelement();

$(tempnode)。文本(选择{X} { 'name' }),(点击选项{X}。行动);

menunode.appendchild(tempnode);

}



$(body).Append (menuNode);

},

毁灭:函数(){

$(。epmenu )删除();

}

};



CSS代码的一部分如下所示:

复制代码代码如下所示:

右键单击菜单

。epmenu {宽度:120px;背景:# f0f0f0;位置:固定;左:0;最高:0;箱的影子:2px 2px 2px 2px # 807878;}

。epmenu一{显示:块;高度:25px;线高度:25px;填充左:15px;边境上:1px solid # e0e0e0;底部边框:1px solid # FFF;字体:字体大小:14px;微软雅黑;光标:默认;}

。epmenu:悬停{背景:# FFF;}



调用代码如下所示创建:

复制代码代码如下所示:

epmenu.create({左:500,上:500 },{ {姓名:步骤,整套可增添文本},{:名称:'b222,整套的addbtn },{:名称:'add图像组件,整套的:addimage } });



被调用的代码的破坏如下:

复制代码代码如下所示:

EpMenu.destory();



结果如下:



呼叫描述:

创作:epmenu.create(点选项);

点整数类型,表示菜单的位置,相对于浏览器的左上角。

示例:{左:100,顶部:500 }

选项JSON数组类型表示菜单项,名称表示名称,动作表示单击激发的动作。

例子:{ {姓名:步骤,整套可增添文本},{:名称:'b222,整套的addbtn },{:名称:'add图像组件,整套的:addimage } }

毁灭:epmenu.destory();

销毁不需要参数。

这真是件简单的事!它还可以扩展,如添加图片、二级菜单等。

以上是本文的全部内容,希望大家能喜欢。