Question

可能重复：
How can I make this jQuery faster than what I have?

目前，我将此脚本用于某种“标签”系统。单击一个选项卡时，它会隐藏所有其他选项卡。他们都是div。但是现在，我认为在选定的div加载之前它的消失速度不够快。它最终会在所选的div下移动，现在正在显示。

我不想要切换，因为正如你所看到的，我有5个标签，我想在点击它们时打开它们各自的“_s”div。淡出，淡入。

任何使淡出效果在淡入之前发生的方法，或者可能会延迟？我不知道如何在此脚本中添加延迟，或检查以确保div在新div淡入之前完全淡化。

我几天前发布了同样的问题，但还没有找到正确的答案。

这是我当前的工作脚本来改变选项卡。堆栈格式化它很奇怪。编辑帖子并在需要时阅读。

在发生任何事情之前，我创建了一个单独的脚本来隐藏除第一个选项卡之外的所有div。这可以集成到您的解决方案中，所以我没有一百个脚本吗？这是来源：

    <script>
  $(document).ready(function () {
  $('#campus_infotab_two_s,#campus_infotab_three_s,#campus_infotab_four_s,#campus_infotab_five_s').hide();
});
  </script>

Now here's the script that controls the "tabs."

    <script>
$("#teach_one").click(function() {
    $("#teach_one_s").fadeIn("slow");
    $("#teach_two_s").fadeOut("fast");
    $("#teach_three_s").fadeOut("fast");
    $("#teach_four_s").fadeOut("fast");
    $("#teach_five_s").fadeOut("fast");
});

$("#teach_two").click(function () {
    $("#teach_two_s").fadeIn("slow");
    $("#teach_one_s").fadeOut("fast");
    $("#teach_three_s").fadeOut("fast");
    $("#teach_four_s").fadeOut("fast");
    $("#teach_five_s").fadeOut("fast");
});

$("#teach_three").click(function () {
    $("#teach_three_s").fadeIn("slow");
    $("#teach_one_s").fadeOut("fast");
    $("#teach_two_s").fadeOut("fast");
    $("#teach_four_s").fadeOut("fast");
    $("#teach_five_s").fadeOut("fast");
});

$("#teach_four").click(function () {
    $("#teach_four_s").fadeIn("slow");
    $("#teach_one_s").fadeOut("fast");
    $("#teach_two_s").fadeOut("fast");
    $("#teach_three_s").fadeOut("fast");
    $("#teach_five_s").fadeOut("fast");
});

$("#teach_five").click(function () {
    $("#teach_five_s").fadeIn("slow");
    $("#teach_one_s").fadeOut("fast");
    $("#teach_two_s").fadeOut("fast");
    $("#teach_three_s").fadeOut("fast");
    $("#teach_four_s").fadeOut("fast");
});
</script>

现在，这是它制作漂亮的HTML：

<ul class="noselect teach_home_navigator_tabs">

stufff stufff stufff stufff stufff

以下是我的一些建议，但都没有效果。猎人提供的那个似乎应该可以工作，但是它说某处存在语法错误，我对jquery进行诊断并不是那么好。谢谢！

How can I make this jQuery faster than what I have?

Answer 1

这是猎人代码修复以消除他的错误。我使用http://www.jslint.com来查找问题。

$(function(){
    $(".infotab").hide(); // hide all content on load

    $("#teach_home_navigator_tabs li").click(function(e){
        var id = this.id;
        var $current = $("#infotab:visible"); // get the currently selected tab
        if ($current.length === 0) {           
            $current.fadeOut("fast", function() { // fade out current
                $("#" + id + "_s").fadeIn("slow"); // fade in selected
            });
        }
        else { $("#" + id + "_s").fadeIn("slow"); } // fade in selected if no current
    });

    $(".teach_home_navigator_tabs li:first").click(); // click first tab on load
});

尝试一下，但你可能不应该问另一个问题，因为你已经有了很多回复的问题。您应该对旧问题留下评论/编辑，以获得答案。

JQuery仍然无法正常工作..同时又慢又太快

1 个答案: