javascript - jQuery Colorpicker 在点击时更改值

标签 javascript jquery color-picker

我正在使用这个 jQuery 颜色选择器 http://www.eyecon.ro/colorpicker/#about

有什么方法可以让它在点击颜色选择器时更改输入的值(*颜色代码)?

现在它仅通过单击颜色选择器上的提交按钮来提交选择的颜色。

    <input type="text" value="#FFFFFF">

    <script type="text/javascript">
    $.noConflict();
    jQuery(document).ready(function ($) {
      $('input').ColorPicker({
          onSubmit: function(hsb, hex, rgb, el) {
              $(el).val('#' + hex);
              $(el).ColorPickerHide();
          },
          onBeforeShow: function () {
              $(this).ColorPickerSetColor(this.value);
          }
      })
      .bind('keyup', function(){
          $(this).ColorPickerSetColor(this.value);
      });
    });

</script>

最佳答案

找不到好的方法,但这里有一个丑陋但希望不是完全糟糕的方法:

jQuery(document).ready(function ($) {
  var $pickerInput;
  $('input').ColorPicker({ 
      onSubmit: function(hsb, hex, rgb, el) {
          $(el).val('#' + hex);
          $(el).ColorPickerHide();
      },
      onBeforeShow: function () {
          $(this).ColorPickerSetColor(this.value);
          $pickerInput = $(this);
      },
      onHide: function(picker) {
          $pickerInput.val('#' + $(picker).find('.colorpicker_hex input').val());
      }
  })
  .bind('keyup', function(){
      $(this).ColorPickerSetColor(this.value);
  });
});

关于javascript - jQuery Colorpicker 在点击时更改值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21934444/

相关文章:

javascript - 如何匹配具有前导和尾随条件以及匹配组的字符串

jquery - 最小高度不缩放

wordpress - 自定义 Wordpress 颜色选择器

javascript - 使用 React 定期重新加载 iframe 的最佳方法是什么?

javascript - 尝试使用 Angular.js 设置默认背景图片

javascript - Node 脚本中的可用模块

javascript - 使用 jQuery UI 拖放 : changing the dragged element on drop

javascript - 定位用户点击的特定链接

ios - Xcode 6 Interface Builder - 颜色选择器奇怪/错误?

javascript - jQuery 颜色选择器不适用于添加的元素