jquery选项卡和datepicker

Question

在使用日期选择器选择日期后，我想返回到上次打开的选项卡。我尝试通过获取选定的选项卡来执行此操作。这适用于静态选项卡，但不适用于ajax调用，因为这些选项卡具有不同的索引号。我怎样才能最好地做到这一点呢？

这是我的代码：

        <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/javascript" src="js/sitewide.js"></script>
    <script type="text/javascript">
        <!--
        $(function(){

            // Tabs
            $('#tabs').tabs({

                ajaxOptions: { cache: false }
            });

            // Datepicker
            $('.datepicker').datepicker({
                onSelect: showDate
            });

        });


        function showDate(date) {
            var $tabs = $('#tabs').tabs();
            var selected = $tabs.tabs('option', 'selected'); // => 0
            location.href = "./index.php?datum="+date+"#tabs-"+selected;
        }

​

在页面的正文中：

<div id="tabs">
<ul>
<li><a href="#tabs-1"><span><img src="img/home-klein.png" border="0" height="15"></span></a></li>
            <li><a href="./includes/c-boten.php?datum=<?php echo $start ;?>"><span>C-boten</span></a></li>
            <li><a href="./includes/gladde-boten.php?datum=<?php echo $start ;?>"><span>Gladde boten</span></a></li>
            <li><a href="./includes/jeugd-boten.php?datum=<?php echo $start ;?>"><span>Jeugdboten</span></a></li>
            <li><a href="./includes/wherries.php?datum=<?php echo $start ;?>" id="tabs4"><span>Wherries</span></a></li>
            <li><a href="./includes/stats.php"><span>Kilometerstanden</span></a></li>
            <li><a href="#tabs-6"><span>Weer & Wind</span></a></li>
            <li><a href="./includes/schadekaarten.php"><span>Schadekaarten</span></a></li>
            <?php
            if($_SESSION["anonymous"] != "1"){
            echo "<li><a href=\"#tabs-8\"><span>Uitloggen</span></a></li>";
            }
            ?>

        </ul>

        <div id="tabs-1">
        div 1 text
        </div>

​

有什么建议吗？

Answer 1

尝试处理选项卡的select事件并在变量中跟踪ui.index。

例如：

var selectedTab = 0;
$('#tabs').tabs({
    ajaxOptions: { cache: false },
    select: function(event, ui) { selectedTab = ui.index; }
});