Javascript jQuery Colorpicker在单击out时更改值

我正在使用这个jQuery颜色选择器

我有没有办法让它在点击颜色选择器时更改输入的值（*颜色代码）

现在，它仅通过单击Colorpicker上的submit按钮提交拾取的颜色

    <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>

$.noConflict（）；
jQuery（文档）.ready（函数（$）{
$（'input'）。颜色选择器({
onSubmit：函数（hsb、十六进制、rgb、el）{
$（el）.val（'#'+hex）；
$（el.ColorPickerHide（）；
},
onBeforeShow:函数（）{
$（this.ColorPickerSetColor）（this.value）；
}
})
.bind（'keyup'，function（）{
$（this.ColorPickerSetColor）（this.value）；
});
});

找不到好方法，但这里有一个丑陋但希望不是完全坏的方法：

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);
  });
});

---

找不到一个好方法，但这里有一个丑陋但希望不是完全坏的方法：

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);
  });
});

---

像这样的怎么样？您可以在onChange事件中访问十六进制信息并将其分配给某个隐藏元素，在本例中，我添加了第二个输入。然后，在onHide中，获取隐藏元素的值并将其指定给当前输入框

HTML:

<input id="hexVal" type="text" value="#FFFFFF">
<input id="hidden" type="text" value="#FFFFFF">

jQuery(document).ready(function ($) {
    $('#hexVal').ColorPicker({
        onSubmit: function (hsb, hex, rgb, el) {
            $(el).val('#' + hex);
            $(el).ColorPickerHide();
        },
        onBeforeShow: function () {
            $(this).ColorPickerSetColor(this.value);
        },
        onChange: function (hsb, hex, rgb) {
            $('#hidden').val('#' + hex);
        },
        onHide: function (picker) {
            $('#hexVal').val($('#hidden').val());
        }
    })
        .bind('keyup', function () {
        $(this).ColorPickerSetColor(this.value);
    });
});

---

.像这样的怎么样？您可以在onChange事件中访问十六进制信息并将其分配给某个隐藏元素，在本例中，我添加了第二个输入。然后，在onHide中，获取隐藏元素的值并将其指定给当前输入框

HTML:

<input id="hexVal" type="text" value="#FFFFFF">
<input id="hidden" type="text" value="#FFFFFF">

jQuery(document).ready(function ($) {
    $('#hexVal').ColorPicker({
        onSubmit: function (hsb, hex, rgb, el) {
            $(el).val('#' + hex);
            $(el).ColorPickerHide();
        },
        onBeforeShow: function () {
            $(this).ColorPickerSetColor(this.value);
        },
        onChange: function (hsb, hex, rgb) {
            $('#hidden').val('#' + hex);
        },
        onHide: function (picker) {
            $('#hexVal').val($('#hidden').val());
        }
    })
        .bind('keyup', function () {
        $(this).ColorPickerSetColor(this.value);
    });
});

---

---

.

您能详细说明一下您想更改什么吗？我想更改输入的颜色代码。我将更新我的问题。你能详细说明一下，你想更改什么吗？我想更改输入的颜色代码。我将更新我的问题。谢谢，但它似乎不起作用。不过，我在控制台中没有看到任何错误。奇怪。你用的是什么浏览器？这里有一些对我有用的。不过，您需要先访问，才能缓存插件文件。真奇怪，你的例子很好用。我正在用Chrome进行测试，你的可以，但我的不行，对不起，我天真地认为picker控件总是作为输入控件的相邻同级进行呈现，所以我的示例只起作用，因为页面上只有一个输入。让我再看看！我已经用一些不那么糟糕的东西更新了我的答案，这将在页面上使用多个输入。对不起，我不知道我在想什么。演示在感谢，但它似乎不工作。不过，我在控制台中没有看到任何错误。奇怪。你用的是什么浏览器？这里有一些对我有用的。不过，您需要先访问，才能缓存插件文件。真奇怪，你的例子很好用。我正在用Chrome进行测试，你的可以，但我的不行，对不起，我天真地认为picker控件总是作为输入控件的相邻同级进行呈现，所以我的示例只起作用，因为页面上只有一个输入。让我再看看！我已经用一些不那么糟糕的东西更新了我的答案，这将在页面上使用多个输入。对不起，我不知道我在想什么。演示在感谢。我有很多这样的输入，所以这对我来说不太合适。啊，对不起，我没有意识到。很高兴你把它和另一个答案分类了！感谢我有很多这样的输入，所以这对我来说不太合适。啊，对不起，我没有意识到。很高兴你把它和另一个答案分类了！