Question

我在下面有以下代码。我想用一行代码替换突出显示的部分，该代码将运行所有代码。这背后的原因是因为我重复使用了这段代码，并且通过复制和粘贴一行代码可以节省很多时间。

关于写这个的最好方法的任何想法？

这是我想用一行代码替换的部分。

$(".menu-item-1").show();
$(".menu-item-2").show();
$(".menu-item-3").show();
$(".menu-item-4").show();
$(".menu-item-5").show();
$(".menu-item-6").show();

以下全部代码。

if (index == 2) {
$("#prev").show();
$("#next").show();
$(".menu-item-1").show();
$(".menu-item-2").show();
$(".menu-item-3").show();
$(".menu-item-4").show();
$(".menu-item-5").show();
$(".menu-item-6").show();
$("#p3-1").delay(1000).fadeIn("slow", function ()   {
    $("#p3-2").delay(500).fadeIn("slow", function ()    {
        $("#p3-3").delay(500).fadeIn("slow", function ()    {
            $("#p3-4").delay(500).fadeIn("slow", function ()    {
                $("#p3-5").delay(500).fadeIn("slow", function ()    {
                    $("#p3-6").delay(500).fadeIn("slow", function ()    {
                        $("#p3-7").delay(500).fadeIn("slow")
                        $("#next").show();
                    });
                });
            });
        });
    });
});
}

Answer 1

$(".menu-item-1").show();
$(".menu-item-2").show();
$(".menu-item-3").show();
$(".menu-item-4").show();
$(".menu-item-5").show();
$(".menu-item-6").show();

应该是

$(".menu-item-1, .menu-item-2, .menu-item-3, .menu-item-4, .menu-item-5, .menu-item-6").show();

jQuery允许您将相同的效果应用于multiple selectors。

Answer 2

这会吗？

$(".menu-item-1, .menu-item-2, .menu-item-3, .menu-item-4, .menu-item-5").show();

Answer 3

尝试：

$(".menu-item-1, .menu-item-2, .menu-item-3, .menu-item-4, .menu-item-5").show();

Answer 4

对于问题的第一部分，您可以在逗号分隔列表中使用多个选择器，例如使用jquery的css：

$(".menu-item-1, .menu-item-2, .menu-item-3, .menu-item-4, .menu-item-5, .menu-item-6").show();

对于整个代码部分，您可以尝试使用一个recusive函数，该函数使用增加的选择器参数调用自身，就像这样（carful可能包含语法错误）：

function showPart(item)
{
    var delay = 500;
    if(item == 1)
    {
        delay = 1000;
    }
    else if(item >= 6)
    {
        $("#p3-7").delay(500).fadeIn("slow")
        $("#next").show();
        return;
    }

    $("#p3-"+item).delay(1000).fadeIn("slow", function ()   {
        showPart(++item);
    });
}
showPart(1);

所以你的整个代码：

if (index == 2) {
    $("#prev, #next, .menu-item-1, .menu-item-2, .menu-item-3, .menu-item-4, .menu-item-5, .menu-item-6").show();
    var showPart = function(item)
    {
        var delay = 500;
        if(item == 1)
        {
            delay = 1000;
        }
        else if(item >= 6)
        {
            $("#p3-7").delay(500).fadeIn("slow")
            $("#next").show();
            return;
        }

        $("#p3-"+item).delay(1000).fadeIn("slow", function ()   {
            showPart(++item);
        });
    }
    showPart(1);
}

jQuery - 运行一个函数来替换常用的代码

4 个答案: