javascript - $(this)toggleClass 不适用于 .each？

Question

您好，我有一些名为 archbar2 的 div，我想使用 .each 循环更改它，但我在 javascript 方面没有任何反应。之前一切正常，因为警报效果很好。为什么我的类(class)没有改变？

jQuery(document).ready(function() {
    var aktywator=0;
    var punkty = 333;
    if(punkty>=10 && punkty<300) aktywator = 0;
    if(punkty>=300 && punkty<800) aktywator = 1;
    if(punkty>=800 && punkty<2000) aktywator = 2;
    if(punkty>=2000 && punkty<5000) aktywator = 3;
    if(punkty>=5000 && punkty<10000) aktywator = 4;
    if(punkty>=10000) aktywator = 5;
    alert(aktywator);
    $('.archbar2').each(function(id) {
        
        if(aktywator==id)
        {
            alert("id=" + id + " aktywator=" + aktywator);
            $(this).toggleClass("archbar");
        }
    })

});

.archbar
{
	width: 50vw;
	height: 13vw;
	background-color: #1274B2;
	text-align: center;
	padding-top: 0.5vw;
	margin-top: 2vw;
	position: relative;
}

.archbar2
{
	width: 50vw;
	height: 13vw;
	background-color: rgba(50,50,50,1);
	text-align: center;
	padding-top: 0.5vw;
	margin-top: 2vw;
	position: relative;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<center>
<div class="archbar2">

</div>
</center>

<center>
<div class="archbar2">

</div>
</center>

<center>
<div class="archbar2">
</div>
</center>

请看这个例子并告诉我为什么它不能正确运行。问候

Answer 1

您的代码可以正常工作，但可能不是您想要的方式。

I want to change class archbar2 to archbar... $(this).toggleClass("archbar") is not working.

如果您想在类之间切换，则必须使用 $.toggleClass() 并将现有类名作为参数以及新类名。

$(this).toggleClass("archbar").toggleClass("archbar2");

这会将两个类切换到元素。

请参阅 .toggleClass() 的 jQuery 文档其中指出:

Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the state argument.