jquery - 在 Google Chrome 中禁用 <input type ="color"> 的颜色选择器

Question

在谷歌浏览器中，<input type="color">创建一个内部有一大块颜色的输入，默认情况下，打开一个颜色选择器(看起来它依赖于操作系统，我的有 Windows 皮肤)。我在全局范围内使用自定义颜色选择器，它连接到 type="color"在大多数浏览器中看起来像这样:

但在 Chrome 中它看起来像这样:

如果您以前从未见过它，一个简单的系统看起来像这样(Windows 7 64 位 Google Chrome 版本 22.0.1229.79 m):

自定义颜色选择器可以很好地覆盖默认颜色选择器，但问题在于它在 Chrome 中的显示方式。另一个问题是我似乎无法清除该值(已尝试过js)，默认值始终是#000000并且不能设置为空。

如果我不想要这种行为，我不应该使用 type="color" 可能是也可能不是真的。 ，但有时我发现 Chrome 的用户界面有点过于激进。更改所有输入 type s 不是我期待的东西，而且我不确定该应用程序还对它们做了什么，所以我最终可能会破坏其他东西。我在日期选择器方面遇到过类似的问题。

有没有什么方法可以改变 Chrome 中的这种行为，这样我就可以拥有一个普通的类似文本的字段？ JavaScript/jQuery 是一个选项，但如果它可以用 CSS 完成 -webkit以某种方式规则会很棒。

Answer 1

在这种情况下你不应该使用 type=color。按照标准，input[type=color]不能为空值。

If the value of the element is a valid simple color, then set it to the value of the element converted to ASCII lowercase; otherwise, set it to the string "#000000".