Jquery ui 试图让jQuery UI选项卡在动态内容上启动

考虑以下几点：

    var ids = [];
    function loadFeeds(id, terms) {
        $("#loadingdiv").removeClass("ui-helper-hidden");
        $('#' + id).empty(); 
      try {
            $.getJSON('https://mysite.com/search.json?q=' + terms', function(data) {
                $.each(data.results, function(i, data) { 
                $('#' + id).append('<tr><td> + data.user + '</td><td>' + data.created + '</td><td>' + data.text + '</td></tr>');                 
                });
            });
        }
        catch (e) {
            alert('Error creating feed - ' + e.Message);
        }
    }
    function loopids()
     {
       for(i=0;i&lt;ids.length;i++)
       {
          loadFeeds(ids[i][0], ids[i][1]);       
       }
     }
    function createTabsList()
     {
       $("#tabs").append('<ul id="tabsul"></ul>');
       for(i=0;i&lt;ids.length;i++)
       {
         $("#tabsul").append('<li><a href="#tabs-' + ids[i][0] +'">Test</a></li>');
       }
     }
... PAGE CODE ...
<div class="content clearfix">
          <div id="tabs" class="ui-tabs">
... REPEATER CODE ...
<div>
                      <xsl:attribute name="id">
                        tabs-<value-of select="@id"/>
                      </xsl:attribute>
                        <table class="display">
                          <tr><th>Search Results</th></tr>
                        </table>
                        <table class="display">
                          <xsl:attribute name="id">
                            <value-of select="@id"/>
                          </xsl:attribute>
                              <thead>
                                <tr>
                                    <th>
                                        User
                                    </th>
                                    <th>
                                        Date
                                    </th>
                                    <th>
                                        Message
                                    </th>
                                </tr>
                            </thead>
                          <tbody></tbody>
                        </table>
                        <script type="text/javascript">
                            ids.push(['<xsl:value-of select="@dataid"></value-of>', '<xsl:value-of select="@txtSearchParams" />']);
                        </script>
                      </div>
... END REPEATER CODE ...
            </div>
        </div>

varids=[]；
函数加载源（id、术语）{
$（“#loadingdiv”）.removeClass（“ui帮助程序隐藏”）；
$（'#'+id）.empty（）；
试一试{
$.getJSON（'https://mysite.com/search.json?q=“+术语”，函数（数据）{
$.each（data.results，function（i，data）{
$（'#'+id）.append（'+data.user+''+data.created+''+data.text+''）；
});
});
}
捕获（e）{
警报（“创建提要时出错-”+e.Message）；
}
}
函数loopids（）
{
对于（i=0；iids.length；i++）
{
加载源（id[i][0]，id[i][1]）；
}
}
函数createTabsList（）
{
$（“#制表符”）.append（“
”）；
对于（i=0；iids.length；i++）
{
$（“#tabsul”）。追加（“
”）；
}
}
... 页面代码。。。
... 中继器代码。。。
标签-
搜索结果
使用者
日期
消息
id.push（[''，]）；
... 结束转发器代码。。。

我可以正确加载表-检查ID，所有内容都正确，但无论我在何处或如何调用$（“tabs”）.tabs（）-它都无法正确呈现内容。当它呈现“选项卡”时，其他表永远不会消失，单击选项卡会导致抛出“未捕获异常”

---

如何让动态选项卡在这种情况下工作。

因此我无法完全实现这一点，因此我使用动态创建的按钮创建了一个解决方案，并手动从jQuery UI添加CSS类

function setTabs(){
        try
        {
         $("div.tabs > div:gt(0)").hide();
          for(var i=0;i<ids.length;i++)
          {
            createButton(i, ids[i][1]);       
          }
          $(".tb").click(function(){
            $(".tb").removeClass('ui-state-active');
            //alert($(this).attr('id'));
            $(this).addClass('ui-state-active');
          });
          $(".Title").each(function(){
                var txt = decodeURIComponent($(this).text());
                $(this).text(txt);
            });
          loopids();
          $(".tb").first().addClass('ui-state-active');
          $("#loadingdiv").addClass('ui-helper-hidden');
        }
        catch(e)
        {
          alert("Error in setTabs - " + e.Message);
        }
    }

这是关键的功能。如果有人碰到这件事，我总能解释得更多