Dynamische Kontextmenüs mit JQuery

Question

Erstellen dynamisches Kontextmenü

Hier wird HTML-Code für Kontextmenü

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

Und die Javascript-Datei wird unter

// 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; 
    } 
}); 

gezeigt Hinweis: Wenn Sie laufen Wenn Sie mit der rechten Maustaste in das Textfeld klicken, erscheint ein Kontextmenü

Klicken Sie auf einen beliebigen Menüpunkt, Sie sehen (die Alarmbox), den Menüpunkt Indexposition zB. 0, 1 2 ...

Statt des Namens des Elements geklickt in

I

Und die JSFiddle für das Kontextmenü den Namen des Menüpunktes sehen möchten.

Vielen Dank im Voraus

Answer 1

Sie dies auf der Callback-Funktion verwenden können:

options.$selected.text()