Question

我想要做的是每次点击标签页时，内容区域都被几乎全新的页面所取代。我不想要一个完整的页面加载，所以我想在ajax中做，但我习惯通过页面方法发回小jason数据。我不确定如何构建一个全新的页面并通过ajax返回，我想简单地将返回的整个内容分配给div并完成它。以最少的开销来实现这一目标的最佳方式是什么（我知道脚本管理器有一些低效的方法来执行ajax）？

或者在iframe中加载标签内容是否更好？

fyi我已经在我的asp网页上使用jquery来调用轻量级的页面方法，而且效果很好。

Answer 1

如果您使用的是Asp.net以及Asp.net Ajax Control Toolkit，您可以使用AjaxControlToolkit Tab控件来实现您的方法。（在任何标签中你必须放一个新页面或一个模块（我建议使用模块））

如果没有，你可以使用Asp.net MultiView控件和一些按钮，每当用户点击一个按钮你就改变了MultiView ActiveViewIndex（通过ajax AsynchPostback）

最后你可以使用一些div并通过javascript控制它们

Answer 2

这里的另一个选择是使用jQuery Tab UI

**编辑：如果这些页面都来自通过AJAX加载的相同域，则可以使用（适用安全限制）。如果需要从其他域加载页面，则可能必须实现跨域策略（需要来自其他域的权限）或使用本地代理脚本来请求数据并将其中继到javascript。（JSONP http://en.wikipedia.org/wiki/JSONP是一个例外。）

查看此链接以获取演示：

http://jqueryui.com/demos/tabs/ajax.html

注意：您必须下载其他jQuery UI库并包含Tabs小部件。

在此处获取：http://jqueryui.com/download

代码看起来像这样：

<link rel="stylesheet" href="jquery.ui.all.css">
<script src="jquery-1.7.2.js"></script>
<script src="ui/jquery.ui.core.js"></script>
<script src="ui/jquery.ui.widget.js"></script>
<script src="ui/jquery.ui.tabs.js"></script>
<script>
$(function() {
    $( "#tabs" ).tabs({
        ajaxOptions: {
            error: function( xhr, status, index, anchor ) {
                $( anchor.hash ).html(
                    "Couldn't load this tab.");
            }
        }
    });
});
</script>


<div id="tabs">
    <ul>
        <li><a href="page1.aspx">Tab 1</a></li>
        <li><a href="page2.aspx">Tab 2</a></li>
        <li><a href="page3.aspx">Tab 3</a></li>
    </ul>
</div>

什么是asp .net中最好（最有效）的方式将整个页面返回到选项卡式内容？

2 个答案: