Подтвердить что ты не робот

Почему не работает backgroundColor = rgb (a, b, c)?

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

Почему цвет фона не меняется в соответствии с значениями RGB? Что я сделал неправильно?

4b9b3361

Ответ 1

Вам нужно использовать кавычки:

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

JS Fiddle demo.

Или:

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

JS Fiddle demo.

Без кавычек JavaScript передает переменные в качестве аргументов a, b и c в функцию undefined, называемую rgb(). Когда вы устанавливаете свойство CSS, вам необходимо передать строку, следовательно, требование цитирования.

Ой, а также вы используете parseInt(), который не требует передачи radix, но это лучше (и проще, чтобы избежать проблем), если вы это сделаете (радиус - ожидаемая числовая база):

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 (В демо я использую 105, чтобы очистить значение по умолчанию, если кнопка cancel используется).

И если кто-то ударит "отменить" в приглашении, вы можете указать аргумент по умолчанию, чтобы убедиться, что передано фактическое значение цвета, поскольку cancel в противном случае, я думаю, оценивается как false (I ' Предположим, вы предпочтете 255, но, очевидно, настройтесь на вкус).

Вы также можете, конечно, просто определить функцию:

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

И этот подход имеет (возможно, благоразумие) преимущество использования пользовательского значения по умолчанию:

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

Литература:

Ответ 2

Использовать кавычки вокруг значения

document.body.style.backgroundColor="rgb(" + a + "," + b + "," + c + ")";

Ответ 3

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/

Ответ 4

У вас нет функции под названием rgb(...)

Я думаю, вы хотели сделать:

document.body.style.backgroundColor = "rgb(" + a + "," + b + "," + c + ");";

Ответ 5

Проблема заключается в том, что цвет должен быть строкой:

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

Демо