Jquery Tab Content

如果答案顯而易見，表示歉意。Jquery Tab Content

我一直在試圖在我一直在努力的項目中實現jquery，但我似乎無法獲得這些選項卡以正確顯示其內容。

<!DOCTYPE html> 

<html lang="en"> 
<head> 
    <title>Jquery Tabs</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <link href="css/assignment14.css" type="text/css" rel="stylesheet" /> 
    <script type="text/javascript" src="jquery-1.11.2.js"></script> 
    <script type="text/javascript" src="jquery/jquery-ui.min.js"></script> 
    <script type="text/javascript" src="jquery/jquery-ui.js"></script> 
    <link href="jquery/jquery-ui.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $('#main').tabs(); 
      }); 
    </script> 

</head> 

<body> 
    <div id="outwrap"> 
     <header> 
      <h1>Tabs</h1> 
     </header> 
     <div id="container3"> 
      <div id="container2"> 
       <div id="container1"> 
        <section id="main"> 
         <div id="details"> 
          <ul class="tabs"> 
           <li><a href="tab1">Tab 1</a></li> 
           <li><a href="tab2">Tab 2</a></li> 
           <li><a href="tab3">Tab 3</a></li> 
           <li><a href="tab4">Tab 4</a></li> 
          </ul> 
         <div id="tab1"><p>Content 1</p></div> 
         <div id="tab2"><p>Content 2</p></div> 
         <div id="tab3"><p>Content 3</p></div> 
         <div id="tab4"><p>Content 4</p></div> 

</body>

來源

2014-12-29 Yurwix

加＃號HREF是

<ul class="tabs"> 
    <li><a href="#tab1">Tab 1</a></li> 
    <li><a href="#tab2">Tab 2</a></li> 
    <li><a href="#tab3">Tab 3</a></li> 
    <li><a href="#tab4">Tab 4</a></li> 
</ul>

看到源代碼http://jqueryui.com/tabs/，看到了演示HERE

來源

2014-12-29 18:52:18

無需＃details'改變''到＃main'。唯一的問題是你提到的鏈接缺少'＃'。 –

你是對的@ GabyakaG.Petrioli –

非常感謝你 – Yurwix

Jquery Tab Content

回答

相關問題