使用JQuery动态更改颜色

use*_*543 3 javascript jquery

下面是一个Jquery脚本,用于在(0,0,0)到(255,255,0)之间随时间改变对象的颜色.

$(document).ready(function(){
    var r = 0;
    var g = 0;
    changeColor(r, g);
});

function changeColor(r, g){
    var newColor = "(" + r + "," + g + ", 0)";

    $("p").css({"color": newColor});
    $("#diag").html(newColor);

    r+=1;
    g+=1;

    if(r <= 255 && g <= 255){
        window.setTimeout(function(){changeColor(r, g);}, 20);
    }
}
Run Code Online (Sandbox Code Playgroud)

HTML是:

    <p>Hello</p>
    <div id="diag"></div>
Run Code Online (Sandbox Code Playgroud)

但是,虽然该函数确实执行(通过如何在#diag中重复显示newColor),但p元素的实际颜色不会改变.有没有想过为什么会这样?谢谢.

Joh*_*ohn 6

你需要改变这一行 var newColor = "(" + r + "," + g + ", 0)";

对此

var newColor = "rgb(" + r + "," + g + ", 0)";
Run Code Online (Sandbox Code Playgroud)