Question

请考虑以下事项：

    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>

我可以正确加载表 - 检查ID，一切都正确，但无论我在哪里或如何调用$（“tabs”）。tabs（） - 它不能正确呈现内容。当它渲染“标签”时，其他表永远不会消失，单击选项卡会导致抛出“未捕获的异常”。

如何在此方案中使用动态标签。

Answer 1

所以我无法完成这项工作，所以我使用动态创建的按钮创建了一个解决方法，并手动从jQuery UI添加CSS类。

function setTabs(){
        try
        {
         $("div.tabs > div:gt(0)").hide();
          for(var i=0;i&lt;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);
        }
    }

这是关键功能。如果每个人都碰到这个问题，我总能解释得更多。

试图让jQuery UI Tabs触发动态内容

1 个答案: