rgb到十六进制转换[关闭]答案

【问题标题】：rgb to hex conversion [closed]rgb到十六进制转换[关闭]
【发布时间】：2013-03-19 08:43:37
【问题描述】：

我想要做的是：

从元素中获取 RGB 值
将其转换为十六进制
将其放入文本字段中

第一种解决方案：

function rgbToHex(r, g, b) {
    return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}

问题是：无论我喂它什么，它都只会返回#aN。是功能有缺陷还是我做错了什么？

See a demo here

第二种解决方案：

来自与上面提到的相同的帖子。

function componentToHex(c) {
    var hex = c.toString(16);
    return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
    return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

如果我将值作为数字传递给 rgbToHex(255,255,255)，则此方法有效，但如果我尝试将数字作为变量 rgbToHex(rgbValue) 提供，则不会执行任何操作。（参见演示中的第 19 到 25 行）

See the demo here

感谢所有帮助:)

【问题讨论】：

那么，你将一个参数传递给一个三参数函数并期望它工作？
谢谢 :) 我只是继续删除这个愚蠢的问题。

标签： javascript hex rgb

【解决方案1】：

试试这个：

function componentToHex(c) {
  var hex = c.toString(16);
  return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
  return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

//Slap the rel values into the fields
$('.color').click(function(e) {
  e.preventDefault();  

  var rgbVal = $(this).attr('rel');

  var rgbValSplit = rgbVal.split(",");

  for (var i = 0; i < 3; i++) {
    if (!rgbValSplit[i]) {
      rgbValSplit[i] = 0;
    }
  }

  var finalHex = rgbToHex(+rgbValSplit[0], +rgbValSplit[1], +rgbValSplit[2]);

  $('.color-picker-rgb').val(rgbVal);
  $('.color-picker-hex').val(finalHex);

  $('body').css('background', finalHex);
});

http://codepen.io/anon/pen/eiqbz

主要问题是您需要像预期的那样传递 3 个参数。另一个问题是它期待的是数字，而不是字符串。因此，当您传递“191”时，c.toString(16) 将评估为 c。如果你给它传递一个数字，比如191，它将评估为正确的值。

【讨论】：