用 javascript 混合超过 2 种颜色答案

【问题标题】：mix more than 2 colors together with javascript用 javascript 混合超过 2 种颜色
【发布时间】：2014-03-13 12:40:55
【问题描述】：

我正在尝试将 JS 颜色添加在一起。我已经坐在这个问题前面好几天了。问题是颜色是十六进制代码。

现在我想将所有颜色添加在一起以打印并在 div 或其他内容中打印出来。

你能给我演示一下如何做吗？

这是我的意思的图片：

十六进制代码是<input> 类型。

【问题讨论】：

“混合”它们是什么意思？像背景中的嘈杂效果？或者你想把两种颜色合二为一？
你必须更精确。你有什么问题，你试过什么？最试探的是什么。如果你的问题是十六进制理解，那和js无关。
这些颜色是硬编码的（所以你只需要一个数组然后打印出来）还是你需要从每个元素中获取它们？
嗯，parseInt(hexaValue, 16) 将十六进制转换为十进制，decimalValue.toString(16) 将十进制转换为十六进制，你可以将这两者结合起来得到你想要的
@LorDex 将它们加在一起，例如，如果我将红色蓝色和绿色加在一起，白色将是“结果”

标签： javascript jquery styles

【解决方案1】：

根据 cmets，我不能 100% 确定您所说的“混合”是什么意思，但假设您想要组合它们，您可以使用诸如 xcolor 之类的插件来实现。

例如$.xcolor.additive(color, color) 计算两种颜色的加色混合。

所以，你可以这样做：

var $inputs = $("input"); // You'll want to make this more specific
var color = "";

$inputs.each(function(){
  var curColor = this.value;
  if(color === ""){
    color = curColor;
  }

  color = $.xcolor.additive(color, curColor);
});

这是一个fiddle

【讨论】：

是的，这就是我要找的。但是有可能将所有 13 种颜色加在一起吗？对于“输入”，我的意思是颜色的值是 html 类型。我可以将“颜色组合”打印到 div 吗？
是的，可以将它们全部加在一起。我用小提琴更新了我的答案，尽管你的组合颜色似乎是白色的
如果你尝试删除一些输入元素，你会看到你得到了不同深浅的紫色和红色。
是的，非常感谢。你在小提琴中创建的那个我已经得到了。但问题是我不明白要打印出新颜色。你知道我的意思吗？
console.log(color) 将输出一个带有getColor()、getHex() 等方法的对象供您试验。你也可以$(mySelector).css("color", color)，或者只是console.log(color.getColor())