2011-01-22 96 views
3

以下是用于创建选项卡页面的HTML代码。jQuery选项卡()函数不显示选项卡

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="jquery-ui-1.8.9.custom.min.js"></script> 
    <title>Testing Tabs</title> 
</head> 
<body> 
    <div id="tabs"> 
    <ul> 
     <li><a href="#panel1">Panel 1</a></li> 
     <li><a href="#panel2">Panel 2</a></li> 
     <li><a href="#panel3">Panel 3</a></li> 
    </ul> 
    <div id="panel1"> 
     <p>This is the text of panel 1</p> 
    </div> 
    <div id="panel2"> 
     <p>This is the text of panel 2</p> 
    </div> 
    <div id="panel3"> 
     <p>This is the text of panel 3</p> 
    </div> 
    </div> 
</body> 

当我执行命令$( '#标签')。标签()(或$( '#标签')。标签({}))在萤火虫的CommandLine,真的没什么发生,即链接仍然是链接,并显示所有div。

回答

4

确保您也包含jQueryUI样式表。

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/ui-lightness/jquery-ui.css" /> 

例子:http://jsfiddle.net/6kg7k/

+0

D'哦!非常愚蠢。 – vishakad 2011-01-23 13:40:19