JQuery右键菜单插件ContextMenu使用指南

2020-05-23 06:00:25易采站长站整理

        padding: ‘1px’
      },
      //菜单项鼠标放在上面样式
      itemHoverStyle: {
        color: ‘blue’,
        backgroundColor: ‘red’,
        border: ‘none’
      },
      //事件   
      bindings:
          {
            ‘item_1’: function(t) {
              alert(‘Trigger was ‘+t.id+’nAction was item_1’);
            },
            ‘item_2’: function(t) {
              alert(‘Trigger was ‘+t.id+’nAction was item_2’);
            },
            ‘item_3’: function(t) {
              alert(‘Trigger was ‘+t.id+’nAction was item_3’);
            },
            ‘item_4’: function(t) {
              alert(‘Trigger was ‘+t.id+’nAction was item_4’);
            }
          }
    });
    //所有div标签class为demo3的绑定此右键菜单
    $(‘div.demo3’).contextMenu(‘myMenu3’, {
    //重写onContextMenu和onShowMenu事件
      onContextMenu: function(e) {
        if ($(e.target).attr(‘id’) == ‘dontShow’) return false;
        else return true;
      },
      onShowMenu: function(e, menu) {
        if ($(e.target).attr(‘id’) == ‘showOne’) {
          $(‘#item_2, #item_3’, menu).remove();
        }
        return menu;