jquery.contextify.js自定义区域弹出右键菜单js插件


jquery.contextify.js自定义区域弹出右键菜单js插件

第一步引入bfwone

第二步执行菜单插件代码

示例如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFWONE.JS DEMO PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0&" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script>
        var options = {
            items: [{
                header: '右键功能菜单'
            },
                {
                    divider: true
                },
                {
                    text: '第一个链接',
                    href: '#'
                },
                {
                    text: '获取菜单参数',
                    onclick: function(e) {
                        alert("你点击了第二个链接,携带的值为"+e.data.name)}},
                {
                    text: '第三个链接',
                    onclick: function() {
                        alert("你点击了第3个链接")}},
                {
                    text: '第四个链接',
                    onclick: function() {
                        alert("你点击了第4个链接")}},
                {
                    divider: true
                },
                {
                    text: '更多...',
                    href: '#'
                }]};
        bready(function() {
            use(["jquery.contextify", "bootstrap"], function() {
                $('.panel-body').contextify(options);
            });
        });
    </script>
</head>
<body>
    <div class="container" style="margin-top:20px;">
        <div class="panel panel-primary">
            <div class="panel-heading">
                jQuery Contextify Demo
            </div>
            <div class="panel-body" data-name="bfw社区">
                使用右键点击这里
            </div>
        </div>
    </div>


</body>
</html>
立即下载jquery.contextify.js查看所有js插件

网友评论0

程序员在线工具箱