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();
销毁不需要参数。
这真是件简单的事!它还可以扩展,如添加图片、二级菜单等。
以上是本文的全部内容,希望大家能喜欢。