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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 16:23:18  来源:igfitidea点击:

Why doesn't backgroundColor=rgb(a,b,c) work?

javascripthtml

提问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 + ')';

JS Fiddle demo.

JS小提琴演示

Or:

或者:

document.body.style.backgroundColor = 'rgb(' + [a,b,c].join(',') + ')';

JS Fiddle demo.

JS小提琴演示

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是传递变量,作为参数,abc以所谓的未定义功能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);

JS Fiddle demo

JS小提琴演示

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);

JS Fiddle demo

JS小提琴演示

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

The problem is that the color needs to be a string:

问题是颜色需要是一个字符串:

var a = parseInt(prompt("Enter R"),10);
var b = parseInt(prompt("Enter G"),10);
var c = parseInt(prompt("Enter B"),10);
document.body.style.backgroundColor = "rgb(" + [a,b,c].join() + ")";

Demo

演示

回答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 + ");";