0

我有以下问题：

我想创建一个网页，我可以在其中通过侧边栏和 jQuery 选项卡本身的上部按钮栏使用 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>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
        <title>title here</title>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="ui.core.js"></script>
        <script type="text/javascript" src="ui.datepicker.js"></script>
        <script type="text/javascript" src="ui.tabs.js"></script>
        <link rel="stylesheet" type="text/css" media="screen" href="local.css" />
        <script type="text/javascript">
            $(document).ready(function(){
            $("#datepicker").datepicker();
        });
        </script>
        <script type="text/javascript">
            $(document).ready(function() {
                $("#tabs").tabs();
            });
            $("select2").click(function() { // bind click event to link
                $("$tabs").tabs("select", 1); // switch to third tab
                return false;
            });
        </script>
    </head>

<body>
    <div id="container">
        <div id="row">
            <div id="leftsubcontainer"><div class="column-in">
                <h4>rev0.1</h4>
                <p>medewerkernaam</p>
                <br/>
                <div type="text" id="datepicker"></div>
                <br/><br/>
                <br/><br/>
                <p>log out</p>
                <button id="select2">kies derde</button>
                <br/><br/>
            </div></div>
            <div id="rightsubcontainer"><div class="column-in">
                <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>tekst1</p>
                    </div>
                    <div id="tabs-2">
                        <p>tekst 2</p>
                    </div>
                    <div id="tabs-3">
                        <p>tekst 3</p>
                    </div>
                </div>
            </div></div>
        </div>
    </div>
</body>
</html>

问题是，每当我单击按钮时，选项卡都不会改变（即它没有选择正确的选项卡）。你们有谁知道我做错了什么？

希望收到大家的来信，

亲切的问候，杰伦

4

1 回答 1

1

您的选择器有一些拼写错误和问题，这会妨碍您。用以下代码替换您的 javascript 代码

$(document).ready(function() {
    var $tabs = $("#tabs").tabs();
    $("#select2").click(function() {
        // bind click event to link
        $tabs.tabs("select", 1); // switch to second tab
        return false;
    });
});

那应该可以正常工作。

于 2009-03-06T12:29:34.897 回答