zoukankan      html  css  js  c++  java
  • ASP.NET2.0中Tabs的简单实现

        不用Asp.net Ajax ControlToolKit中的Tabs控件实现Tabs效果的简单实现方法:
     1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
     2
     3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     4<html xmlns="http://www.w3.org/1999/xhtml">
     5<head runat="server">
     6    <title>Tabs</title>
     7</head>
     8<body>
     9    <form id="form1" runat="server">
    10        <div>
    11            <fieldset>
    12                <legend>
    13                    <asp:Button ID="btnView1" runat="server" Text="显示View1" BackColor="ControlLight" OnClick="btnView1_Click" />
    14                    <asp:Button ID="btnView2" runat="server" Text="显示View2" BackColor="ControlLight" OnClick="btnView2_Click" />
    15                    <asp:Button ID="btnView3" runat="server" Text="显示View3" BackColor="ControlLight" OnClick="btnView3_Click" />
    16                </legend>
    17                <asp:MultiView ID="MultiView1" runat="server" OnActiveViewChanged="MultiView1_ActiveViewChanged">
    18                    <asp:View ID="View1" runat="server">
    19                        <span style="color: background">这是View1!</span></asp:View>
    20                    <asp:View ID="View2" runat="server">
    21                        <span style="color: #ff66cc">这是View2!</span></asp:View>
    22                    <asp:View ID="View3" runat="server">
    23                        <span style="color: darkolivegreen">这是View3!</span></asp:View>
    24                </asp:MultiView></fieldset>
    25        </div>
    26    </form>
    27</body>
    28</html>
    29
     1using System;
     2using System.Data;
     3using System.Configuration;
     4using System.Collections;
     5using System.Web;
     6using System.Web.Security;
     7using System.Web.UI;
     8using System.Web.UI.WebControls;
     9using System.Web.UI.WebControls.WebParts;
    10using System.Web.UI.HtmlControls;
    11
    12public partial class Default2 : System.Web.UI.Page
    13{
    14    protected void Page_Load(object sender, EventArgs e)
    15    {
    16        if (!IsPostBack)
    17        {
    18            MultiView1.ActiveViewIndex = 0;
    19        }

    20    }

    21    protected void MultiView1_ActiveViewChanged(object sender, EventArgs e)
    22    {
    23        switch (MultiView1.ActiveViewIndex)
    24        {
    25            case 0:
    26                btnView1.BorderStyle = BorderStyle.Inset; ;
    27                btnView2.BorderStyle = BorderStyle.NotSet; ;
    28                btnView3.BorderStyle = BorderStyle.NotSet;
    29                break;
    30            case 1:
    31                btnView2.BorderStyle = BorderStyle.Inset; ;
    32                btnView1.BorderStyle = BorderStyle.NotSet; ;
    33                btnView3.BorderStyle = BorderStyle.NotSet;
    34                break;
    35            case 2:
    36                btnView3.BorderStyle = BorderStyle.Inset; ;
    37                btnView1.BorderStyle = BorderStyle.NotSet; ;
    38                btnView2.BorderStyle = BorderStyle.NotSet;
    39                break;
    40        }

    41    }

    42    protected void btnView1_Click(object sender, EventArgs e)
    43    {
    44        MultiView1.ActiveViewIndex = 0;
    45    }

    46    protected void btnView2_Click(object sender, EventArgs e)
    47    {
    48        MultiView1.ActiveViewIndex = 1;
    49    }

    50    protected void btnView3_Click(object sender, EventArgs e)
    51    {
    52        MultiView1.ActiveViewIndex = 2;
    53    }

    54}
    演示图片:

  • 相关阅读:
    JavaScript对iframe的DOM操作
    如何处理JSON中的特殊字符
    JavaScript引擎是单线程的
    JSONP跨域的原理解析
    四道JavaScript面试题检测你的js基本功
    让IE6也支持position:fixed
    Keras Layer 的 call(x) 和 input_shape
    C++文件读写 fwrite 和 fread
    Windows Ubuntu 子系统修改默认登陆用户·
    Python新建文件夹(如果不存在)
  • 原文地址:https://www.cnblogs.com/gyche/p/GYChe.html
Copyright © 2011-2022 走看看