Jquery $（此）的语法正确

我有一个jquery函数，在这里我重复了太多次.red方法

我想把它们换成美元（这个），但我显然不知道正确的方法

$(".red").ready(function () {
    $(this).addClass("active");
});

这是一个简化版本的代码，我希望它的行为，希望它对你们有意义

这里的想法是能够替换初始的.red，并将其应用于我在函数中添加的所有代码行

问候

编辑：我试图最大限度地简化它，因为我经常在复杂的解释中迷失方向，因为我有点不好意思发布我的蹩脚代码lol，下面是我想要优化的代码：

function showRed() {
    $(".red").show();
    if (position == 0) {
        $(".red").css({opacity : "0", left: "0"}).transition({opacity:1}, 500, ezin);
    } else if (position < 1){
        $(".red").css({left : "100%", });
    } else if (position > 1) {
        $(".red").css({left : "-100%", });
    }
    position = 1;
    goodbye();
    $(".red").css({scale: "1"}).transition({left:0}, 500, ezin).addClass("active");
}

function showGreen() {

    $(".green").ready(function(){
        $(".green").show();
        if (position == 0) {
            $(".green").css({opacity : "0", left: "0"}).transition({opacity:1}, 500, ezin);
        } else if (position < 2){
            $(".green").css({left : "100%", });
        } else if (position > 2) {
            $(".green").css({left : "-100%", });
        }
        position = 2;
        goodbye();
        $(".green").css({scale: "1"}).transition({left:0}, 500, ezin).addClass("active");
    });

}

函数showRed（）{
$（“.red”）.show（）；
如果（位置==0）{
$（“.red”）.css（{opacity:“0”，left:“0”}）.transition（{opacity:1}，500，ezin）；
}否则如果（位置<1）{
$（“.red”）.css（{左：“100%”，}）；
}否则，如果（位置>1）{
$（“.red”）.css（{左：“-100%”，}）；
}
位置=1；
再见（）；
$（“.red”）.css（{scale:“1”}）.transition（{left:0}，500，ezin）.addClass（“active”）；
}
函数showGreen（）{
$（“.green”）.ready（函数（）{
$（“.green”）.show（）；
如果（位置==0）{
$（“.green”）.css（{opacity:“0”，left:“0”}）.transition（{opacity:1}，500，ezin）；
}否则如果（位置<2）{
$（“.green”）.css（{左：“100%”，}）；
}否则，如果（位置>2）{
$（“.green”）.css（{左：“-100%”，}）；
}
位置=2；
再见（）；
$（“.green”）.css（{scale:“1”}）.transition（{left:0}，500，ezin）.addClass（“active”）；
});
}

我想要的是优化所有这些，这样我就不必为每一张幻灯片编写这些代码。顺便说一句，我使用的是jQuery transit，这里的transition很像动画

showBlue也一样

这就是它的工作原理：

您需要使用：

$(document).ready(function () { 
    $(".red").addClass("active");
});

上面的代码会在页面加载时将class

active

添加到class

红色的div中

.ready（）
方法只能在与当前文档匹配的jQuery对象上调用

$(document).ready(function () {
    var $red = $('.red');
    $red.addClass("active");
    $red.somethingelse();
});

像这样的

$(document).ready(function () { 
    function updateRed($class) {
        $class.addClass("active");  
    }
    var $red = $('.red');
    updateRed($red);
});

您的问题是，在您的代码
中，此
指的是文档对象。这是因为ready伪事件绑定到文档，取消了用于绑定此伪事件的任何项目的注册

事实上，看起来你想要：

$(document).ready(function(){
    var $reds = $('.red'); 
    // then you can use $reds inside this ready handler scope
});

看看你的代码，你想做的第一件事就是一步一步地把你对
$（“.green”）
的所有使用重构成一个局部变量

这将使：

function showGreen() {
    var element = $(".green");
    element.show();
    if (position == 0) {
        element.css({opacity : "0", left: "0"}).transition({opacity:1}, 500, ezin);
    } else if (position < 2){
        element.css({left : "100%", });
    } else if (position > 2) {
        element.css({left : "-100%", });
    }
    position = 2;
    goodbye();
    element.css({scale: "1"}).transition({left:0}, 500, ezin).addClass("active");
}

然后可以将其称为
show（$（'.red'））
或
show（$（'.green'））

或者，如果您想将其称为：

$('.red').click(showRed);

然后您可以将函数更改为“启动”

var element = $(this)

这应该是你想要的。
你想完成什么？你在这里问什么？元素没有
.ready（）
事件。只有
文档
可以。你想干什么？您想什么时候添加
活动的
类？也许您应该向我们显示您使用“.red”太多次的代码，我们可以帮助您优化它。向我们展示不符合您要求或没有意义的代码不会帮助我们帮助您。：）你不必显示所有的代码，但正如其他人指出的那样，你不应该以这种方式调用
.ready
，因此我假设你的原始代码也不需要。也许，根本不清楚OP实际上在做什么。我想这就是我需要的，我会在几个小时后尝试，并让你知道，感谢您努力理解我的意思：D我很难描述我想做什么。您应该删除
元素。ready
@a.Wolff:很好。我更专注于重构而不是代码整理当然值得注意的是，
.ready
不应该在这里，如果它在那里，因为OP没有在ready中调用此函数，那么可能需要在调用此函数的位置添加一个。这些函数正在被window.location.hash更改调用。如果（window.location.hash==“”）{showRed（）；}在这种情况下，我建议的第一个方法应该可以工作。如果你有什么不明白的，请告诉我。
var element = $(this)