-1

我正在努力检查一切，但这个 tabify 不想工作。我检查了所有内容 100 次，但仍然找不到错误。这是我的代码

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
        <script src="https://jquery-tabify.googlecode.com/files/jquery.tabify-1.4.js"
        type="text/javascript"></script>
        <script>
            $('#menu').tabify();
        </script>
        <style>
            body {
                font: 0.8em Arial, sans-serif;
            }
            #menu {
                padding: 0;
            }
            #menu li {
                display: inline;
            }
            #menu li a {
                background: #ccf;
                padding: 10px;
                float:left;
                border-right: 1px solid #ccf;
                border-bottom: none;
                text-decoration: none;
                color: #000;
                font-weight: bold;
            }
            #menu li.active a {
                background: #eef;
            }
            .content {
                float: left;
                clear: both;
                border: 1px solid #ccf;
                border-top: none;
                border-left: none;
                background: #eef;
                padding: 10px 20px 20px;
                width: 400px;
            }
        </style>
    </head>

    <body>
        <ul id="menu">
            <li class="active"><a href="#contentHome">Home</a>
            </li>
            <li><a href="#contentGuestbook">Guestbook</a>
            </li>
            <li><a href="#contentLinks">Links</a>
            </li>
        </ul>
        <div class="content" id="contentHome">Content for Home</div>
        <div class="content" id="contentGuestbook">My guestbook</div>
        <div class="content" id="contentLinks">Lin</div>
    </body>

</html>
4

1 回答 1

1

将您的代码包装在$(document).ready()：

<script>
  $(function() {
    $('#menu').tabify();
  });
</script>

有了这个，您的脚本将在所有内容加载后执行。#menu没有它 - 如果尚未加载，它将不会做任何事情。

于 2013-09-01T09:23:37.897 回答