首页 » 技术教程 » 正文
摘要:这是一个 JavaScript 的右键菜单类库,通过它我们可以快速实现右键菜单。

效果

JavaScript右键菜单类库下载使用方法
JavaScript右键菜单类库下载使用方法

如何快速添加右键菜单到网页中?

首先将 imenu.css,itorr.m.js,itorr.menu.js 导入到你的网页head标签中。
类似于

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="imenu.css">
    <!-- iTorr.js 函数库 -->
    <script src="itorr.m.js"></script>
    <!-- Menu 类 -->
    <script src="itorr.menu.js"></script>
    <script>
    $.Menu.reg($('h1'), [ //右键菜单列表
      {
        text: '我是右键菜单第一项', //右键菜单文字内容
        func: function() { //回调函数
          alert('回调成功');
         }
       }
     ]);
    </script>
    </head>
  <body></body>
</html>

推荐使用

方式一

$.Menu.reg($('h1'),[{
    text:'我是右键菜单第一项', //右键菜单文字内容
    func:function(){ //回调函数
        alert('回调成功');
    }
}],{
    open:function(dom){
        console.log('打开了菜单',dom);
    }
});


方式二

$.Menu.reg($('h1'),{
    menu:[{
        text:'我是右键菜单第一项', //右键菜单文字内容
        func:function(){ //回调函数
            alert('回调成功');
        }
    }],
    open:function(dom){
        console.log('打开了菜单',dom);
    }
});


方式三

$.Menu.reg({
    dom:$('h1'),
    menu:[{
        text:'我是右键菜单第一项', //右键菜单文字内容
        func:function(){ //回调函数
            alert('回调成功');
        }
    }],
    open:function(dom){
        console.log('打开了菜单',dom);
    }
});


或则链式语法

$.Menu.reg($('h1'),[{
    text:'我是大标题'
    //无 func 的情况 点击即消失,没有回调函数~
}]).reg('p',[{ //在所有 p 标签上注册
    text:'我是 P 标签', //右键菜单文字内容
    func:function(dom){ //回调函数
        alert('回调成功',dom);
    }
}]);


添加多级菜单支持,格式如下

$.Menu.reg('span',[{
    text:'我是大标题'
    child:[{
        text:'我是子菜单'
    },{
        text:'我是子菜单2',
        func:function(){
            alert('子菜单回调');
        }
    },{
        text:'我是子菜单3',
        child:[{
        text:'我还有子菜单~'
        }]
    }]
}])

文件下载

附件:menu.js.zip

文件大小:6.8kb

更新时间:2018-12-27

本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有,若为付费资源,请在下载后24小时之内自觉删除,若作商业用途,请到原网站购买,由于未及时购买和付费发生的侵权行为,与本站无关。本站发布的内容若侵犯到您的权益,请联系本站删除,我们将及时处理!

标签:

未经允许不得转载:作者:锅巴网络, 转载或复制请以 超链接形式 并注明出处 锅巴资源
原文地址:《JavaScript右键菜单类库下载使用方法》 发布于2018-12-27

赞(1) 打赏 生成海报

评论 抢沙发

1 + 6 =


长按图片转发给朋友

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

目前网站从前段时间应工信部备案要求调整,目前已恢复正常
目前网站从前段时间应工信部备案要求调整,目前已恢复正常
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册