jquery - 带颜色框的 HTML 颜色选择器

Question

我正在设置 HTML 代码，我想在 HTML 中显示颜色列表，如下所示:

如果我想创建颜色列表，我需要创建一个表格和 div block 列表，颜色如下:

<table style="user-select: none;">
  <tbody style="user-select: none;">
    <td style="user-select: none;">Background colour</td>
    <div title="RGB (0, 0, 0)" style="background-color: rgb(0, 0, 0); user-select: none;"></div>
    <div title="RGB (68, 68, 68)" style="background-color: rgb(68, 68, 68); user-select: none;"></div>
    <div title="RGB (102, 102, 102)" style="background-color: rgb(102, 102, 102); user-select: none;"></div>
  </tbody>
</table>

我会发现有很多工作要做，我可能不需要这样做。我试图在 google 上查找以搜索我要查找的内容，但我无法找到它，所以我需要你的帮助。

如果我想在 html 中创建颜色列表，我是否必须创建一个包含带有颜色的 div block 列表的表格，或者是否有办法创建一个简短的 HTML 代码以使其更短、更容易和更快，以便我可以像屏幕截图显示的那样显示背景颜色和文本颜色？

谢谢。

Answer 1

抱歉，我现在还不能评论这个“解决方案”。这不是最佳解决方案，但您可以尝试此方法以防万一您尝试过的方法无效:

<input id="color" type="color" onchange="submitValue(this.value);" value="#ffffff" placeholder="#000000">

然后，您可以将选择的颜色传递给另一个函数，在本例中，传递给函数“submitValue();”

希望对您有所帮助!