多个jquery选项卡的显示不正确

Question

我遇到了一个我不知道如何解决或导致问题的问题。

基本上我有一个带有jquery选项卡的页面。选项卡通过ajax加载，就像官方jquery页面上的示例一样。 然而，在加载的页面上，我有更多标签。换句话说，您打开第一页，其中包含选项卡，并且在该选项卡中打开的其中一个页面具有另一个选项卡列表。

我确保所有ID都是唯一的。但是，会发生什么是页面加载正常，没有错误，一切正常。我再次切换到下一个标签，没有问题，一切正常，新页面加载了另一个标签列表。甚至那些标签再次起作用。但是，当我回到第一个原始选项卡时，它会抛出一个javascript错误，表明tabs（）不是一个函数，并且整个页面结构都会混乱。

这是我要加载的第一个页面： http://meteopage.com/subdom/downloads/template/pages/station/report_annual.php?y=2012

然后，“极值”标签应该加载此页面： http://meteopage.com/subdom/downloads/template/pages/station/report_annual1.php?y=2012

另外它们工作正常，但是如果你尝试点击第一页上的Extremes选项卡，它会加载第二个罚款，但是当你切换回原始的Summary选项卡并再次切换到Extremes选项卡时，它就会搞砸了。换句话说，如果你继续在选项卡之间切换，它只在第一次加载页面时才能正常工作，但是在切换之后它会向我发出错误。

感谢提前提示

代码基本上是这样的：

第一个主页：

<div id="tabs" class="centered">
    <ul style="align:center">
            <li>
                <a href="#tabs-1"><?php echo lang("Summary")?></a>
            </li>
            <li>
                <a href="report_annual1.php?y=2012?></a>
            </li>
        </ul>
        <div id="tabs-1"></div>
 </div>
    <script>
    $(function() {
            $( "#tabs" ).tabs();
    })
    </script>

然后在第二个标签中加载的第二个页面具有完全相同的代码，excelt #tabs被称为＃tabs2和divs tabs-21，tabs22等。