使用AJAX将ASPX页面加载到jQuery UI选项卡中

Question

我对jquery和普通html页面有一些经验，但才刚刚开始学习.net。我到处找过，找不到如何用ajax将aspx页面加载到jquery ui选项卡中的好教程或示例。我有一个Main.aspx页面，其中有一些用于导航的jquery ui选项卡。我想用ajax加载每个选项卡的内容。我曾尝试使用jquery ui选项卡的Ajax模式，但当aspx页面包含某些web控件时，似乎由于某种原因无法加载。我想加载到选项卡中的aspx文件只有一个按钮控件，当单击该控件时，它会将文本更改为"你好"。

以下是Main.aspx的选项卡部分：

<div id="tabs">
    <ul>
        <li><a href="test.aspx"><span>Test</span></a></li>
        <li><a href="#tabs-2">Second</a></li>
        <li><a href="#tabs-3">Third</a></li>
   </ul>
   <div id="tabs-2">Second Tab</div>
   <div id="tabs-3">Third Tab</div>
</div>

以下是test.aspx代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" 
    Inherits="TropicalServerGUI.test" %>
<div>
    <asp:button ID="btn" runat="server" text="Button" />
</div>

及其背后的代码：

namespace TropicalServerGUI {
    public partial class test : System.Web.UI.Page {
        protected void Page_Load(object sender, EventArgs e) {
        }
        protected void btn_Click(object sender, EventArgs e) {
            //btn.Text = "hello";
        }
    }
}

第二个和第三个选项卡是静态的，可以正常工作，但第一个选项卡中没有加载任何内容。如果我删除按钮控件并放入例如<h1>Hello World</h1>，则它可以正确加载页面。我知道我做了一件完全错误的事情，我找不到任何网站来解决这个话题，所以如果能提供任何帮助，我将不胜感激！

Answer 1

您正在初始化JQueryUI选项卡吗？

<script>
    $(function() {
        $( "#tabs" ).tabs();
    });
</script>