Javascript jQuery UI选项卡不正确

因此，我使用jQueryUI（带选项卡）来标记页面上的一些内容。然而，有一个棘手的问题正在发生

我有两个选项卡，“KR”和“O”-当我点击“O”选项卡时，我确实得到了正确的内容。然而，如果我点击“KR”标签，我会得到KR和O？检查下面的图片以供查看

下面是PHP/HTML代码

                    <div id="right_side_menu">

                <div id="sub_menu">
                    <ul>
                        <?php if($money_type == TRUE) : ?><li><a href="#tab-coins"><span>Kr</span></a></li> <?php endif ?>
                        <?php if($tasks_type == TRUE) : ?> <li><a href="#tab-hours"><span>O</span></a></li> <?php endif ?>
                        <?php if($hours_type == TRUE) : ?> <li><a href="#tab-tasks"><span>T</span></a></li> <?php endif ?>
                    </ul>
                </div> <!-- end sub_menu -->

                <div class="clear"></div>

                <br />

                <div id="statistics">

                    <?php if($money_type == TRUE) : ?>

                        <div id="tab-coins">
                            <ul>
                                <li><span id="statistics_big"> <?php if($total_year_money == FALSE) { echo '0'; } else { echo $total_year_money; } ?> </span><br><span class="statistics_underline">Kroner totalt i år</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_medium"> <?php if($total_month_money == FALSE) { echo '0'; } else { echo $total_month_money; } ?> </span><br><span class="statistics_underline">Kroner denne måneden</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_small"> <?php if($total_highest_money == FALSE) { echo '0'; } else { echo $total_highest_money; } ?> </span><br><span class="statistics_underline">Høyest salg denne måneden</span></li>
                            </ul>
                        </div> <!-- end tab-coins -->

                    <?php endif ?>

                    <?php if($hours_type == TRUE) : ?> 

                        <div id="tab-hours">
                            <ul>
                                <li><span id="statistics_big"> <?php if($total_year_hours == FALSE) { echo '0'; } else { echo $total_year_hours; } ?> </span><br><span class="statistics_underline">Timer totalt i år</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_medium"> <?php if($total_month_hours == FALSE) { echo '0'; } else { echo $total_month_hours; } ?> </span><br><span class="statistics_underline">Timer denne måned</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_small"> <?php if($total_highest_hours == FALSE) { echo '0'; } else { echo $total_highest_hours; } ?> </span><br><span class="statistics_underline">Høyest antall timer denne måneden</span></li>
                            </ul>
                        </div> <!-- end tab-coins -->

                    <?php endif ?>

                    <?php if($tasks_type == TRUE) : ?>

                        <div id="tab-tasks">
                            <ul>
                                <li><span id="statistics_big"> <?php if($total_year_tasks == FALSE) { echo '0'; } else { echo $total_year_tasks; } ?> </span><br><span class="statistics_underline">Arbeidsoppgaver totalt i år</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_medium"> <?php if($total_month_tasks == FALSE) { echo '0'; } else { echo $total_month_tasks; } ?> </span><br><span class="statistics_underline">Arbeidsoppgaver denne måneden</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_small"> <?php if($total_highest_tasks == FALSE) { echo '0'; } else { echo $total_highest_tasks; } ?> </span><br><span class="statistics_underline">Høyest arbeidsoppgaver denne måneden</span></li>
                            </ul>
                        </div> <!-- end tab-coins -->

                    <?php endif ?>

                    <div class="clear"></div>

                </div>

            </div> <!-- end right side menu -->

Kroner totalt iår

Kroner denne måneden

Høyest salg denne måneden



计时器总数

计时器denne måned
Høyest antall计时器denne måneden



绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对绝对

Arbeidsoppgaver denne måneden

Høyest arbeidsoppgaver denne måneden

这是现场输出

<div id="right_side_menu">

                <div id="sub_menu">
                    <ul>
                        <li><a href="#tab-coins"><span>Kr</span></a></li>                            <li><a href="#tab-hours"><span>O</span></a></li>                                                   </ul>
                </div> <!-- end sub_menu -->

                <div class="clear"></div>

                <br />

                <div id="statistics">


                        <div id="tab-coins">
                            <ul>
                                <li><span id="statistics_big"> 0 </span><br><span class="statistics_underline">Kroner totalt i år</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_medium"> 0 </span><br><span class="statistics_underline">Kroner denne måneden</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_small"> 0 </span><br><span class="statistics_underline">Høyest salg denne måneden</span></li>
                            </ul>
                        </div> <!-- end tab-coins -->




                        <div id="tab-tasks">
                            <ul>
                                <li><span id="statistics_big"> 0 </span><br><span class="statistics_underline">Arbeidsoppgaver totalt i år</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_medium"> 0 </span><br><span class="statistics_underline">Arbeidsoppgaver denne måneden</span></li>
                                <div class="clear"></div>
                                <li><span id="statistics_small"> 0 </span><br><span class="statistics_underline">Høyest arbeidsoppgaver denne måneden</span></li>
                            </ul>
                        </div> <!-- end tab-coins -->


                    <div class="clear"></div>

                </div>

            </div> <!-- end right side menu -->

0
Kroner totalt iår
0
Kroner denne måneden
0
Høyest salg denne måneden


0
平均总收入
0
Arbeidsoppgaver denne måneden
0
Høyest arbeidsoppgaver denne måneden

我使用的脚本

<script>
$(function() {
    $( "#right_side_menu" ).tabs();
});

</script>

$（函数（）{
$（“#右侧#菜单”）.tabs（）；
});

首先，如果您可以让选项卡使用最基本的HTML，请尝试：

<ul>
    <li><a href="#tabOne">One</a></li>
    <li><a href="#tabTwo">Two</a></li>
    <li><a href="#tabThree">Three</a></li>
</ul>
<div id="tabOne">One</div>
<div id="tabTwo">Two</div>
<div id="tabThree">Three</div>

一个
两个
三

我看到您的选项卡周围有一些额外的HTML，这可能会造成干扰。

---

除此之外，绝对要确保你的HTML中有所有的“菜单按钮”。

我想。。您有一个错误的选项卡id选择器

<li><a href="#tab-hours"><span>O</span></a>
            // -----^----- //here

//这里

您没有id=“tab hours”的

。。（然而，我仍然想知道，即使id错误，该选项卡如何能够向您显示其他选项卡任务…）

无论如何，它应该是

<li><a href="#tab-tasks"><span>O</span></a>
             --^-- here

--^--这里

而这正在起作用

---

您的

中是否缺少一个

#选项卡任务

？我只看到一个按钮。欢迎。。。快乐编码…）