Question

我正在尝试的是：

从元素中选取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

所有帮助表示赞赏：）

Answer 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，它将评估为正确的值。

rgb到十六进制转换

1 个答案: