我建议你可以使用一些像Spectrum这样的颜色选择器库
https://bgrins.github.io/spectrum/
这一个包括颜色选择器与各种意见和其他功能，是免费的。
这可以保存大量的时间和工作

我认为这将是大量的修修补补做你的具体解决方案。要做你的解决方案，我会做一个包含40个单元格的html表，然后为每个单元格定义一种颜色，编写代码来定义用户选择了哪一个，以便以后用于任何你需要的目的。
如果是我，我会用这样的东西：代码：http://widget.colorcodehex.com/color-picker.html

<div style="font-family: Arial,Helvetica,sans-serif; border: solid 1px #cccccc; position: absolute; width: 240px; height: 326px; background: #ffffff; -moz-box-shadow: 0 0 6px rgba(0,0,0,.25); -webkit-box-shadow: 0 0 6px rgba(0,0,0,.25); box-shadow: 0 0 6px rgba(0,0,0,.25); -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;">

<div style="background-color: #2d6ab4; position: absolute; top: 0px; left: 0px; width: 100%; height: 22px; text-align: center; padding-top: 2px; font-weight: bold; border-top-right-radius: 5px; border-top-left-radius: 5px;"><a style="text-decoration: none; color: #ffffff;" target="_blank" href="http://www.colorcodehex.com/">HTML Color Picker</a></div>

有了这个，你可以得到同样的结果（或者在我的oppion更好，因为用户可以定义他们想要的任何颜色），但你不必坐下来做所有的表颜色代码和用户交互代码。
/S

如果你真的想把它作为一个选择，你可以这样做：

<select>
    <option style="background-color:red" value="red">Red</option>
    <option style="background-color:green" value="green">Green</option>
    <option style="background-color:#0000ff" value="#0000ff">Blue (as hex)</option>
</select>

这完全不需要JavaScript。