AJAX Toolkit(3)--Tabs

xml 代码

<ajaxToolkit:TabContainer ID="TabContainer1" runat="server"
           OnClientActiveTabChanged="ClientFunction"
           Height="150px"> <!--Clientfunction 是客户端处理程序，需要用javascript写 -->
           <ajaxToolkit:TabPanel ID="TabPanel1" runat="server"
           HeaderText="Signature and Bio">
           <ContentTemplate>
               1123
           </ContentTemplate>
           </ajaxToolkit:TabPanel>
           <ajaxToolkit:TabPanel ID="TabPanel2" runat="server"
           HeaderText="abc">
           <ContentTemplate>
               1123
           </ContentTemplate>
           </ajaxToolkit:TabPanel>

       </ajaxToolkit:TabContainer>
       <asp:Label ID="msg" Text=""  runat="server"/>

客户端处理程序

js 代码

<script type="text/javascript">
        function ClientFunction(sender, e){
            var mlabel =  $get('<%=msg.ClientID%>');
            //取得客户端控件
            mlabel.innerHTML = sender.get_activeTab().get_headerText();
            // 当前标题，放到相应控件上去
            alert(sender.get_activeTab().get_headerText());

        }
    </script>

注意，客户端因为有了<%%>之间的代码，所以，必须要放到有runat="server"的标签之内。
<ajaxToolkit:TabPannel>可以有多个。
运行结果：