您的位置:首页 > 编程语言 > ASP

ASP.NET 用MultiView和View实现选项卡效果

2017-07-20 15:00 495 查看
转自:http://blog.csdn.net/chinajiyong/article/details/7577604

                  ASP.NET中的MultiView和View可以作为其他控件的容器,提供了一种可方便地显示信息的替换视图方式。通常情况下, MultiView和View搭配使用。我一般很少使用这两控件,本文讲讲用MultiView和View实现选项卡效果。贴上前台代码:

[html] view
plain copy

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication3._Default" %>  

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">  

<head runat="server">  

    <title>用MultiView和View实现选项卡效果</title>  

</head>  

<body>  

    <form id="form1" runat="server">  

    <div>  

        <asp:Button ID="btnIntroduction" runat="server" BorderWidth="0" Text="公司简介" OnClick="btnIntroduction_Click" />  

        <asp:Button ID="btnWelcome" runat="server" BorderWidth="0" Text="欢迎加盟" OnClick="btnIntroduction_Click" />  

        <table style="border: 1px ridge #0000FF; width: 100%;">  

            <tr valign="top">  

                <td style="width: 300; height: 250">  

                    <asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">  

                        <asp:View ID="View1" runat="server">  

                            <asp:Label ID="Label1" runat="server"></asp:Label>  

                        </asp:View>  

                        <asp:View ID="View2" runat="server">  

                            <asp:Label ID="Label2" runat="server"></asp:Label>  

                        </asp:View>  

                    </asp:MultiView>  

                </td>  

            </tr>  

        </table>  

    </div>  

    </form>  

</body>  

</html>  

设计效果如下:



用两个Button(btnIntroduction、btnWelcome)作为切换Tab按钮,这两个Button按钮关联到同一个事件处理。其实用ImageButton来实现应该会更好看一点。

后台cs实现切换功能代码:

[csharp] view
plain copy

using System;  

using System.Collections;  

using System.Configuration;  

using System.Data;  

using System.Linq;  

using System.Web;  

using System.Web.Security;  

using System.Web.UI;  

using System.Web.UI.HtmlControls;  

using System.Web.UI.WebControls;  

using System.Web.UI.WebControls.WebParts;  

using System.Xml.Linq;  

  

namespace WebApplication3  

{  

    public partial class _Default : System.Web.UI.Page  

    {  

        protected void Page_Load(object sender, EventArgs e)  

        {  

            Label1.Text = @"本公司为一家集软件开发、传统网络开发以及无线网络开发的大型科技公司。公司自成立以来经过长期发展,取得了80多项国家专利!" + "\r\n" +  

@"本公司为一家集软件开发、传统网络开发以及无线网络开发的大型科技公司。公司自成立以来经过长期发展,取得了80多项国家专利!" + "\r\n" +  

@"本公司为一家集软件开发、传统网络开发以及无线网络开发的大型科技公司。公司自成立以来经过长期发展,取得了80多项国家专利!" + "\r\n" +  

@"本公司为一家集软件开发、传统网络开发以及无线网络开发的大型科技公司。公司自成立以来经过长期发展,取得了80多项国家专利!";  

            Label2.Text = @"欢迎有志之士加盟本公司!  

        软件开发工程师  

        要求:   

        1、热爱软件行业;   

        2、熟悉、net框架,能熟练使用C#和JavaScript进行编码;   

        3、熟悉SQL Server等常用的数据库;   

        4、有良好的编码规范习惯;   

        5、做事认真负责,服从公司的工作安排;   

        6、吃苦耐劳,敬业。 ";  

        }  

  

        protected void btnIntroduction_Click(object sender, EventArgs e)  

        {  

            //获取被触发的Button对象  

            Button b = (Button)sender;  

            if (b.ID == "btnIntroduction")  

            {  

                //激活View1  

                MultiView1.SetActiveView(View1);  

            }  

            else  

            {  

                //激活View2  

                MultiView1.SetActiveView(View2);  

            }  

        }  

    }  

}  

浏览效果:



内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: