0

可能重复：
我怎样才能让这个 jQuery 比我拥有的更快？

目前，我将此脚本用于一种“选项卡”系统。单击一个选项卡时，它会隐藏所有其他选项卡。他们都是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">

东西 东西 东西 东西 东西 东西

这是我的一些建议，但没有一个有效。Hunter 提供的那个似乎应该可以工作，但它说某处存在语法错误，我对 jquery 的诊断不是很好。谢谢！

我怎样才能让这个 jQuery 比我拥有的更快？

4

1 回答 1

0

这是修复了猎人代码以消除他的错误。我使用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
});

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

于 2011-03-24T03:19:20.493 回答