javascript - Bootstrap 形式的光谱颜色选择器插件

Question

我正在尝试将光谱颜色选择器放入右侧的 Bootstrap 表单中。

频谱 github:

https://github.com/bgrins/spectrum

它没有正常工作，正如在这个 jsfiddle 中所见:

http://jsfiddle.net/b5gnupfn/

<div class="input-group">
  <input type="text" class="form-control" placeholder="Username" aria-describedby="basic-addon1">
  <span class="input-group-addon" id="basic-addon1">
       <input type='text' class='my_color'/>
  </span>
</div>

编辑:

我只是希望它像 .input-group 中的其他 .input-group-addon 或 .input-group-btn 元素一样整齐地适合文本形式。现在看起来很奇怪。

编辑:

修复了 jsfiddle，现在关于这个问题是准确的。

Answer 1

一个可能的解决方案是将 .input-group-addon 更改为 .input-group-btn 并添加 .input-group-lg 类到整个输入组。

<div class="input-group input-group-lg">
  <input type="text" class="form-control" placeholder="Username" aria-describedby="basic-addon1">
   <span class="input-group-btn" id="basic-addon1">
       <input type='text' class='my_color'/>
   </span>
</div> 

这是一个 fiddle 示例:http://jsfiddle.net/b5gnupfn/1/ .我不确定这是否是您想要的，但它看起来可行。