jquery ui tabs不工作

Question

I have the following script which does not work. 我有以下脚本不起作用。 it should be using jquery tabs, but the links are not converting to tabs for some reason: 它应该使用jquery选项卡，但由于某些原因链接没有转换为选项卡：

<!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>
    <title>Untitled Page</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />

    <script type="text/javascript" language="javascript"> 
        $(document).ready(function(){
            $( "#tabs" ).tabs();
        });
    </script>

</head>
<body>

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Nunc tincidunt</a></li>
        <li><a href="#tabs-2">Proin dolor</a></li>
        <li><a href="#tabs-3">Aenean lacinia</a></li>
    </ul>
    <div id="tabs-1">
        <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, </p>
    </div>
    <div id="tabs-2">
        <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus </p>
    </div>
    <div id="tabs-3">
        <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. </p>
    </div>
</div>
</body>
</html>

Answer 1

For your document on jsfiddle, you need to enter your page in the format that Fiddle expects. 对于jsfiddle上的文档，您需要以Fiddle期望的格式输入您的页面。 Only the HTML in the HTML panel and only the JS in the javascript panel. 只有HTML面板中的HTML和javascript面板中的JS。 Your HTML should only include what goes inside the body element. 您的HTML应该只包含body元素内的内容。 Your JS should only include what goes inside the script tag. 您的JS应该只包含脚本标记内的内容。 You shouldn't include DOCTYPE, body, or html elements. 您不应包含DOCTYPE，正文或html元素。 You shouldn't include the script tag itself. 您不应该包含脚本标记本身。 See the documents here: http://doc.jsfiddle.net/basic/introduction.html#entering-code . 请参阅此处的文档： http ： //doc.jsfiddle.net/basic/introduction.html#entering-code 。 The code will work if you do this. 如果你这样做，代码将工作。

Once you have that done, you only need to include/reference the correct CSS that does the styling and it will display as a tabbed interface. 完成后，您只需要包含/引用执行样式的正确CSS，它将显示为选项卡式界面。 For your standalone document, this is all that needs to be done. 对于您的独立文档，这就是所有需要完成的工作。

jquery ui tabs不工作

问题描述

1 个解决方案

解决方案1
0 已采纳 2011-03-08 13:02:36

jquery ui tabs不工作

问题描述

1 个解决方案

解决方案1 0 已采纳 2011-03-08 13:02:36

解决方案1
0 已采纳 2011-03-08 13:02:36