javascript - 根据背景更改文本。

Question

所以我有一个颜色动态变化的页面。文本也将如此。这是我正在使用的。

if (parseInt(color, 16) > 0xffffff/2) {}

问题是该代码不适用于 000000，因此当我在十六进制框中输入该代码时，文本保持黑色，使其不可读。 Here's演示

Answer 1

isDark 方法没有给出正确的结果，您可以使用另一个函数来检查颜色。

var getRGB = function (b) {
  var a;
  if (b && b.constructor == Array && b.length == 3) return b;
  if (a = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(b)) return [parseInt(a[1]), parseInt(a[2]), parseInt(a[3])];
  if (a = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(b)) return [parseFloat(a[1]) * 2.55, parseFloat(a[2]) * 2.55, parseFloat(a[3]) * 2.55];
  if (a = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(b)) return [parseInt(a[1], 16), parseInt(a[2], 16), parseInt(a[3],
16)];
  if (a = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(b)) return [parseInt(a[1] + a[1], 16), parseInt(a[2] + a[2], 16), parseInt(a[3] + a[3], 16)];
return (typeof (colors) != "undefined") ? colors[jQuery.trim(b).toLowerCase()] : null
};

var isDark = function (color) {
  var rgb = getRGB(color);
  if (!rgb) return null;
  return (0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]) > 180 ? false : true;
}

Fiddle Demo