탭 리 셋 방지

17115 단어 tab
오늘 프로젝트 중 에 작은 문제 가 있 는 것 을 발 견 했 습 니 다. 바로 tab 가 항상 새로 고침 을 하 는 것 입 니 다. 인터넷 에 접속 하여 새로 고침 을 방지 하 는 Tab 예 를 복사 하 였 습 니 다. 감사합니다.
붙 여 주세요. 참고 하 세 요.
<!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></title>

    <link href="../Style/StyleLightBlue/css/hrms.css" rel="stylesheet" type="text/css" />

    <link href="../Style/StyleLightBlue/css/table.css" rel="stylesheet" type="text/css" />

    <script src="../Style/jquery/jquery.js" type="text/javascript"></script>

    <script src="../Style/jquery/Basic.js" type="text/javascript"></script>

    <script language="javascript" type="text/javascript">

        $(function () {

            $("div.tab").hide(); //    

            $("div.tabs a:first").addClass("current"); //       

            $("div.tab:first").show(); //       



            $("div.tabs a").click(function () {

                $("div.tabs a").removeClass("current"); //    tab  current  

                $(".tab").hide(); //    

                $(this).addClass("current");

                var activeTab = $(this).attr("href"); //  div

                $(activeTab).show();

            });

        });

    </script>

    <style type="text/css">

        .tabs

        {

            list-style: none;

            width: 400px;

            height: 23px;

        }

        .tabs a

        {

            display: block;

            float: left;

            padding: 2px 3px;

            background: #eff7ff;

            text-decoration: none;

            margin-right: 2px;

        }

        .tabs a.current

        {

            background: #a1c6de;

            color: #000;

        }

        .tab

        {

            display: block;

            width: 400px;

            height: 300px;

            border: 1px solid #ccc;

        }

    </style>

</head>

<body>

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

    <div>

        <div class="tabs">

            <a href="#xiangmu">    </a>

            <a href="#kehu">    </a>

        </div>

        <div id="xiangmu" class="tab"  >

                

        </div>

        <div id="kehu" class="tab" >

                

        </div>

    </div>

    </form>

</body>

</html>

좋은 웹페이지 즐겨찾기