jQuery的contextMenu加載項目通過Ajax調用

Question

我使用下面的上下文菜單插件爲jQuery 1.8.11.js和使用「構建」回調來動態創建每次點擊菜單。

http://medialize.github.com/jQuery-contextMenu/index.html

我想能夠動態加載菜單選項時被點擊（呼叫確定所述可用選項的控制器的方法取決於項目的ID）

項目我問題是這個上下文菜單庫似乎不支持ajax調用，並且如果我嘗試在'build'回調中進行ajax調用，它顯然不會等到ajax調用完成。

這裏是什麼，我試圖做一個精簡的代碼片段：

$.contextMenu({ 
    selector: '" + contextMenuSelector + @"', 
    build: function ($trigger, e) { 
    menuOptionsArray = []; 
     //Ajax START 
     $.ajax({ 
      type: "POST", 
      url: <myurl>, 
      //async: false, //**IF I UN-COMMENT THIS, IT WORKS** 
      context: $(this), 
      success: function (data) { 
        //BUILD THE OPTIONS ARRAY 
        menuOptionsArray... 
       } 
      }); 
     //Ajax END 

     //This returns before the ajax call finishes    
     return { 
      items: menuOptionsArray 
     }; 
    } 

在上面，設置異步=虛假的作品，但因爲這是過時了，我不希望使用。

是否有任何其他方式異步加載項目，或者這將需要修改插件？

Answer 1

我有同樣的問題，我切換到jQuery UI菜單小部件，並使用焦點事件和刷新功能。

這裏是一個小提琴：http://jsfiddle.net/3r5FX/

這裏我寫了一些關於它： http://imnotsmartjustlucky.blogspot.se/2013/06/jquery-context-menu-asynchronousajax.html

代碼摘錄： HTML：

<ul id="menu" style="width:300px"> 
<li class="ui-state-disabled"><a href="#">Aberdeen</a></li> 
<li> 
    <a href="#">Delphi</a> 
    <ul> 
       <li><a href="#"><img src="http://cdn-3.nikon-cdn.com/static/images/icons/icon_loading.gif"/></a></li> 
    </ul> 
</li> 
<li><a href="#">Saarland</a></li> 
<li class="ui-state-disabled"><a href="#">Amesville</a></li> 
</ul> 

JS：

$(function(){ 
    $("#menu").menu({ 
     focus: function(event, ui) { 
      if(ui.item.children("ul").children("li").children("a").children("img").length > 0){ 
       $.get("http://fiddle.jshell.net", function(data){ 
        ui.item.children("ul").html("<li><a href='#'>Viktor</a></li><li><a href='#'>Sweden</a></li><li><a href='#'>Luleå</a></li>") 
        $("#menu").menu("refresh") 
       }) 
      } 
     } 
    }); 

});