2016-05-19 3 views
0

Создания динамического Контекстного менюДинамическое контекстное меню с помощью JQuery

Вот код для контекстного меню

<div class="simple-context-menu">Right Click Me</div> 

И файл Javascript показан ниже

// setup: 

// Install JQuery Plugin from here: 
// https://github.com/swisnl/jQuery-contextMenu 
// DOCS: http://swisnl.github.io/jQuery-contextMenu/ 

var menu1_item_names = ['item1', 'item2', 'item3']; 
var menu2_item_names = ['item4', 'item5', 'item6']; 

$.contextMenu({ 
    selector: '.test-context-menu', 
    build: function($trigger, e) { 
     var options = { 
      callback: function(key, options) { 
      alert("Clicked on " + key + " on element " + options.$trigger.attr("id")); 
      // TODO: 
      // Display NAME of the menu item clicked(example: item1) 
      //alert("Clicked on item: " + JSON.stringify(options.items));      
      return false; 
      }, 
      // start with an empty map 
      items: { 
      "fold1": { 
       "name": "menu 1", 
       "items": {} 
      }, 
      "fold2": {}     
      } 
     }; 

     $.each(menu1_item_names, function(k, v) { 
      options.items.fold1.items[k] = { 
      name: v 
      }; 
     }); 

     if (typeof menu2_item_names !== 'undefined' && menu2_item_names.length > 0) { 
      options.items.fold2 = { 
            "name": "menu 2", 
            "items": {} 
           } 

      $.each(menu2_item_names, function(k, v) { 
       options.items.fold2.items[k] = { 
       name: v 
       }; 
      }); 
     } 

     options.items.sep1 = "---------"; 
     options.items.quit = { 
      name: "Quit" 
     }; 
     return options; 
    } 
}); 

Примечания: При запуске его и щелкните правой кнопкой мыши в указанном выше текстовом поле, появится контекстное меню

Нажмите на любой пункт меню, вы увидите (поле предупреждения), позицию позиции элемента меню, например. 0, 1 2 ...

Вместо названия элемента щелкнул в

Я хотел бы видеть название пункта меню

И в JSFiddle для контекстного меню.

Спасибо заранее

ответ

2

Вы можете использовать это на функцию обратного вызова:

options.$selected.text() 
+0

работает большое спасибо много ... – Prashanth

Смежные вопросы