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();”

希望这会有所帮助!