Javascript 为什么 backgroundColor=rgb(a,b,c) 不起作用?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14323082/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why doesn't backgroundColor=rgb(a,b,c) work?
提问by Daniel Victor
<html>
<head>
<title> Colors </title>
</head>
<body>
<script type="text/javascript">
var a = parseInt(prompt("Enter R"));
var b = parseInt(prompt("Enter G"));
var c = parseInt(prompt("Enter B"));
document.body.style.backgroundColor=rgb(a,b,c);
</script>
</body>
</html>
Why doesn't the background color change according to the RGB values? What have I done wrong??
为什么背景颜色不根据 RGB 值改变?我做错了什么??
回答by David says reinstate Monica
You need to use quotes:
您需要使用引号:
document.body.style.backgroundColor = 'rgb(' + a + ',' + b + ',' + c + ')';
Or:
或者:
document.body.style.backgroundColor = 'rgb(' + [a,b,c].join(',') + ')';
Unquotedthe JavaScript is passing the variables, as arguments, a,band cto an undefined function called rgb(). As you're setting a CSS property you need to pass a string, hence the requirement of quoting.
未加引号的JavaScript是传递变量,作为参数,a,b并c以所谓的未定义功能rgb()。当您设置 CSS 属性时,您需要传递一个字符串,因此需要引用.
Oh, and also you're using parseInt()which doesn't requirea radix to be passed in, but it's better (and easier to avoid problems) if you do (the radixbeing the expected number-base):
哦,还有你使用parseInt()它不要求在传递一个基数,但它是更好的(和更容易避免的问题),如果你这样做(的基数是预期数量基):
var a = parseInt(prompt("Enter R"), 10) || 255,
b = parseInt(prompt("Enter G"), 10) || 255,
c = parseInt(prompt("Enter B"), 10) || 255;
JS Fiddle demo(In the demo I use 105just so it's clear the default is being used if the cancelbutton is used).
JS Fiddle 演示(在我使用的演示中105,很明显,如果使用cancel按钮,则使用默认值)。
And if someone hits 'cancel' on the prompt, you might want to supply a default argument to ensure that an actual colour-value is passed, since cancelotherwise, I think, evaluates to false(I'm assuming you'd prefer 255, but obviously adjust to taste).
如果有人在提示中点击“取消”,您可能需要提供一个默认参数以确保传递实际的颜色值,cancel否则我认为评估为false(我假设您更喜欢255,但显然根据口味调整)。
You could also, of course, simply define a function:
当然,您也可以简单地定义一个函数:
function rgb(r,g,b) {
return 'rgb(' + [(r||0),(g||0),(b||0)].join(',') + ')';
}
var a = parseInt(prompt("Enter R"), 10),
b = parseInt(prompt("Enter G"), 10),
c = parseInt(prompt("Enter B"), 10);
document.body.style.backgroundColor = rgb(a,b,c);
And this approach has the (perhaps specious) benefit of allowing a custom default value to be used:
这种方法具有允许使用自定义默认值的(也许是似是而非的)好处:
function rgb(r,g,b, def) {
def = parseInt(def, 10) || 0;
return 'rgb(' + [(r||def),(g||def),(b||def)].join(',') + ')';
}
var a = parseInt(prompt("Enter R"), 10),
b = parseInt(prompt("Enter G"), 10),
c = parseInt(prompt("Enter B"), 10);
document.body.style.backgroundColor = rgb(a,b,c,40);
References:
参考:
回答by MrCode
Use quotes around the value
在值周围使用引号
document.body.style.backgroundColor="rgb(" + a + "," + b + "," + c + ")";
回答by malkassem
rgb needs to be in quotation mark:
rgb 需要在引号中:
<html>
<head>
<title> Colors </title>
</head>
<body>
<script type="text/javascript">
var a = parseInt(prompt("Enter R"));
var b = parseInt(prompt("Enter G"));
var c = parseInt(prompt("Enter B"));
document.body.style.backgroundColor='rgb(' + a + ',' + b + ',' + c + ')';
</script>
</body>
</html>
jsFiddle http://jsfiddle.net/pduQ6/
jsFiddle http://jsfiddle.net/pduQ6/
回答by malkassem
回答by Naftali aka Neal
You have no function called rgb(...)
你没有调用函数 rgb(...)
I think you meant to do:
我想你的意思是:
document.body.style.backgroundColor = "rgb(" + a + "," + b + "," + c + ");";

