Question

<script>
$(function() {
    $( "#tabs" ).tabs({
        ajaxOptions: {
            error: function( xhr, status, index, anchor ) {
                $( anchor.hash ).html(
                    "Couldn't load this tab. We'll try to fix this as soon as possible. " +
                    "If this wouldn't be a demo." );
            }
        }
    });
});
</script>



<div class="demo">

    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">Name</a></li>
            <li><a href="#tabs-2">Address</a></li>
        </ul>
        <div id="tabs-1">
            <div id="dynamicContent">
                John Doe
            </div>
        </div>
        <div id="tabs-2">
            Cupertino, California
        </div>
    </div>

</div><!-- End demo -->

我在页面加载后使用ajax调用加载dynamicContent。

加载数据后，div顶部漂亮的彩色样式标签将替换为无序列表：

- Name
- Address

我尝试在ajax调用完成后重置选项卡以取消选择：

$( "#tabs" ).tabs({ selected: -1 });

但这不起作用。

还有别的尝试吗？

Answer 1

它应该与{selected: -1}一起使用。请参阅working demo。在这里，我正在使用AJAX＆amp;显示jsfiddle网站的文档信息选项卡。

我猜你的样式表或类被ajax响应覆盖，从而消除了tab效果。

在FF + Firebug中，在您的内容被AJAX加载并检查其类之后检查您的无序列表。

如何关闭动态加载的jQuery选项卡，直到有人点击它们为止？

1 个答案: