js страница из нескольких вкладок

Discussion in 'PHP' started by ultimatum, 6 Jun 2007.

  1. ultimatum

    ultimatum Elder - Старейшина

    Joined:
    28 Apr 2007
    Messages:
    142
    Likes Received:
    65
    Reputations:
    -13
    В одной из книг нашел код как зделать страницу состоящую из нескольких вкладок , но данный код почемуто не работет у меня и немогу понять где ошибка.Прозьба указать меня на ошибку
    HTML:
    <html>
<head>
<script type="text/javascript">
//обьявление функции которая выполняет переключение между вкладками
function showTab(pTabIndex)
    {
    var i=0;
    for (i=0 ; i<tabs.length ; i++)
    {
    //делаем нужный контент-вкладку видимой.
    //стальное - невидимами
    tabs[i].style.display = (i == pTabIndex) ? "block" : "none";
    //выделяем гиперссылку-корешок, соответствующую видимой вкладке,серым фоном , остальные - белым
     tabs[i].style.backgroundColor = (i == pTabIndex) ? "#cccccc" : "#ffffff";
       }
    {
  </script>
   <!-- создаём стилевые классы для контейнеров ,содержащего гиперссылки-корешки вкладок , и для контейнера б  содержащего сами вкладки  -->
         <style>
     .tabhost
         {
       border: thin solid #cccccc;
       padding:5px;
       }
     .tabhs A
         {
       border: thin solid #cccccc;
       padding: 5px 5px 0px 5px ;
       }
       </style>
     </head>
     <body>
     <div class="tabhs">
     <A id="tabH1" href="#" ONCLICK="showTab(0);">вкладка 1 </A>&nbsp;
     <A id="tabH2" href="#" ONCLICK="showTab(1);">вкладка 2 </A>&nbsp;
     <A id="tabH3" href="#" ONCLICK="showTab(2);">вкладка 3 </A>
     </div>
     <div class="tabhost">
         <div id="tab1"><p>это содержимое первой вкладкиp</p>
       </div>
         <div id="tab2"><p>это содержимое второй вкладкиp</p>
       </div>
         <div id="tab3"><p>это содержимое третей вкладки </p>
       <p>это содержимое  </p>
       <p>это содержимое  </p>
       <p>это содержимое  </p>
         </div>
     </div>
     <SCRIPT TYPE="text/javascript">
     var tabs = new Array();
     tabs[0] = document.all["tab1"];
     tabs[1] = document.all["tab2"];
     tabs[2] = document.all["tab3"];
     var tabHs = new Array();
     tabHs[0] = document.all["tabH1"];
     tabHs[1] = document.all["tabH2"];
     tabHs[2] = document.all["tabH3"];
     //делаем изначально видимую первую вкладку
     showTab(0);
     </SCRIPT>
    </body>
    </html>
    -----------------------
     
    #1 ultimatum, 6 Jun 2007
    3 people like this.
  2. je0n

    je0n Elder - Старейшина

    Joined:
    14 May 2006
    Messages:
    345
    Likes Received:
    96
    Reputations:
    41
    одна закрывающая фигурная скобка не в ту сторону повернуту :)
    Code:
    <html>
<head>
<script type="text/javascript">
//обьявление функции которая выполняет переключение между вкладками 
function showTab(pTabIndex) 
{ 
	var i=0; for (i=0 ; i<tabs.length ; i++) 
	{ 
		//делаем нужный контент-вкладку видимой. 
		//стальное - невидимами 
		tabs[i].style.display = (i == pTabIndex) ? "block" : "none";
		 //выделяем гиперссылку-корешок, соответствующую видимой вкладке,серым фоном , остальные - белым 
		tabs[i].style.backgroundColor = (i == pTabIndex) ? "#cccccc" : "#ffffff"; 
	} 
} 
</script>  
<!-- создаём стилевые классы для контейнеров ,содержащего гиперссылки-корешки вкладок , и для контейнера б содержащего сами вкладки -->  
<style>
  .tabhost { border: thin solid #cccccc; padding:5px; } 
  .tabhs A { border: thin solid #cccccc; padding: 5px 5px 0px 5px ; } 
</style>  
</head>  
<body>  
<div class="tabhs">  
<A id="tabH1" href="#" ONCLICK="showTab(0);">вкладка 1 </A>&nbsp;  
<A id="tabH2" href="#" ONCLICK="showTab(1);">вкладка 2 </A>&nbsp;  
<A id="tabH3" href="#" ONCLICK="showTab(2);">вкладка 3 </A>  
</div>  <div class="tabhost">  
<div id="tab1"><p>это содержимое первой вкладкиp</p>  </div>  
<div id="tab2"><p>это содержимое второй вкладкиp</p>  </div>  
<div id="tab3"><p>это содержимое третей вкладки </p>  <p>это содержимое </p>  <p>это содержимое </p>  <p>это содержимое </p>  </div>
 </div>  
 <SCRIPT TYPE="text/javascript">
 var tabs = new Array();
 tabs[0] = document.all["tab1"]; 
 tabs[1] = document.all["tab2"]; 
 tabs[2] = document.all["tab3"]; 
 var tabHs = new Array(); 
 tabHs[0] = document.all["tabH1"]; 
 tabHs[1] = document.all["tabH2"]; 
 tabHs[2] = document.all["tabH3"]; 
 //делаем изначально видимую первую вкладку 
 showTab(0); 
 </SCRIPT>  
 </body>  
 </html>
     
    #2 je0n, 6 Jun 2007
    Last edited: 6 Jun 2007
    1 person likes this.
  3. ultimatum

    ultimatum Elder - Старейшина

    Joined:
    28 Apr 2007
    Messages:
    142
    Likes Received:
    65
    Reputations:
    -13
    спасибо точно

    +
    это ещё раз говорит о том что ночью кодить вредно )))) хотя никто не мешает))
     
    #3 ultimatum, 6 Jun 2007
  4. GreenBear

    GreenBear наркоман с медалью

    Joined:
    7 May 2005
    Messages:
    2,547
    Likes Received:
    1,398
    Reputations:
    612
    это говорит, что надо юзать дебагеры.
     
    #4 GreenBear, 6 Jun 2007
(You must log in or sign up to post here.)
Loading...
Similar Threads - страница нескольких вкладок
  1. GAiN

    MySql: дублирование одной строки несколько раз

    GAiN, 9 Feb 2023, in forum: PHP
    Replies:
    3
    Views:
    7,417
    sherxan-g
    20 Mar 2023
Language
English (US)
    ANTICHAT ™ © 2001-2027 Antichat Kft.