3

假设我在其他一些选项卡中有一些jQuery EasyUI 选项卡。单击外部选项卡时,内部选项卡通过 Ajax 加载。单击内部选项卡时,我想通过 Ajax 在单击的内部选项卡的面板中加载一些内容。我遇到的问题是,因为内部选项卡是通过 Ajax 加载的,所以我不能使用它:

$('.inner_tabs').tabs({
    onSelect: function(title, index){                           
        // do stuff
    }       
});

在我的内部选项卡面板中加载内容(因为内部选项卡是稍后在 DOM 中添加的(所以,$('.inner_tabs')甚至无法识别)。我知道通常这个问题是通过使用.on()jQuery 的方法来解决的。但是我怎样才能将它应用到我的目前情况?如何.on()配合onSelectjQuery EasyUI的回调使用?

4

1 回答 1

3

将内部选项卡添加到 DOMsuccess,您需要在 ajax 请求的回调中重新初始化内部选项卡。

你可以这样做:

$('#outer_tabsid').tabs({
    onSelect: function(title, index){                           
    $.ajax({type: "POST",
       url: "ajaxurl.jsp?param="+index,                    
       success: function (response) {
       var innertabid='innerTab'+index;
       $('#outer_tabsid').tabs('add',{  
             title:'New Tab',  
             content:'<div id="'+innertabid+'" class="easyui-tabs" style= "width:500px;    height:250px;">',
          });
          $('#'+innertabid).tabs({
              onSelect: function(title1, index1){
                  // ajax call to load the selected innertab;
               }
         });

   });
    }       
});
于 2013-03-22T17:44:14.860 回答