Javascript 委托while循环、JS和jQuery的结果

Javascript 委托while循环、JS和jQuery的结果,javascript,jquery,Javascript,Jquery,我有一个while循环,在20秒内从175计数到255,即175、215、235、255。 这些结果存储在变量red中,该变量使用jQuery连接到背景色属性中 $(function(){ var red=175; while (red <= 235){ red+=20; console.log(red); } $('.change').next().css({"backgroundColor":"rgb("+re

我有一个while循环,在20秒内从175计数到255,即175、215、235、255。 这些结果存储在变量red中,该变量使用jQuery连接到背景色属性中

    $(function(){
    var red=175;
    while  (red <= 235){
       red+=20; 
       console.log(red); 
    }

    $('.change').next().css({"backgroundColor":"rgb("+red+",255,50)"})

    });
当I console.log为红色时,它会记录上面提到的所有四个数字。当红色连接到backgroundColor值时,它只使用返回的最终数字。我的问题是,有没有一种方法可以将四个独立的结果委托给同一个类的四个连续的背景色值


您可能想尝试以下方法:

$(function () {
    var red = 175; //set the initial value for your variable
    $('.change').css('background-color', function () { //use the call back function of css to return the value
      return "rgb(" + (red += 20) + ",255,50)";  //return the rgb along with incrementing for the next element
    });

});
在您当前的代码中,您所做的是增加变量的值,直到达到您的条件,因此最终您将变量的值`设为235,然后您将其应用于除第一个之外的所有变量,并使用您的语句

$'.change'.next.css{backgroundColor:rgb+red+,255,50}

请查看带有函数参数的for.css


不确定您是否对检查有意义您可以尝试以下方法:

$(function () {
    var red = 175; //set the initial value for your variable
    $('.change').css('background-color', function () { //use the call back function of css to return the value
      return "rgb(" + (red += 20) + ",255,50)";  //return the rgb along with incrementing for the next element
    });

});
在您当前的代码中,您所做的是增加变量的值,直到达到您的条件,因此最终您将变量的值`设为235,然后您将其应用于除第一个之外的所有变量,并使用您的语句

$'.change'.next.css{backgroundColor:rgb+red+,255,50}

请查看带有函数参数的for.css


不确定你对检查是否有意义这个怎么样?循环通过匹配的div并增加它们的红色。如果由于某种原因,您有4个以上的匹配元素,这也不会中断。它只会对元素4应用255的红色val+

var red = 175; // First matching element has a red val of 175
$('.change').each(function() {
    $(this).css('background-color', 'rgb(' + red + ',255,50)');
    if (red <= 235) red += 20; // Only increment red if it's <= 235
});

小提琴显示6个提琴未断:

这个怎么样?循环通过匹配的div并增加它们的红色。如果由于某种原因,您有4个以上的匹配元素,这也不会中断。它只会对元素4应用255的红色val+

var red = 175; // First matching element has a red val of 175
$('.change').each(function() {
    $(this).css('background-color', 'rgb(' + red + ',255,50)');
    if (red <= 235) red += 20; // Only increment red if it's <= 235
});

小提琴显示6个音未断:

你的意思是这样的吗

$(function(){
    var red=175;
    var currElem = $(".change").first();
    while  (red <= 235){
       red+=20; 
       console.log(red); 
       currElem.css({"backgroundColor":"rgb("+red+",255,50)"});
       currElem = currElem.next(".change");
    }

});

你是说像这样的事吗

$(function(){
    var red=175;
    var currElem = $(".change").first();
    while  (red <= 235){
       red+=20; 
       console.log(red); 
       currElem.css({"backgroundColor":"rgb("+red+",255,50)"});
       currElem = currElem.next(".change");
    }

});

谢谢,这比我尝试的方式简单多了。@BryanK不客气。你对红色复选框有什么意义吗?这样循环将在255结束。这是rgb颜色标尺的结尾啊,就在那里。我以为你想对其他元素重复这个循环。像这样谢谢,这比我尝试的方式简单多了。@BryanK不客气。你对红色复选框有什么意义吗?这样循环将在255结束。这是rgb颜色标尺的结尾啊,就在那里。我以为你想对其他元素重复这个循环。这样地