1

我正在使用来自以下网址的引导颜色选择器：http ://www.eyecon.ro/bootstrap-colorpicker/

HTML 代码：

<div class="well">
    <div class="input-append color" data-color="rgb(255, 146, 180)" id="cp3">
        <input type="text" class="span2" id="colorinput" value="" >
        <span class="add-on"><i style="background-color: rgb(255, 146, 180)"></i></span>
    </div>
</div>

<a href="#" id="external-link">Set Color</a>

外部链接的 JavaScript 代码：

$('#external-link').click(function(){
    //value = 'rgb(255, 255, 255)';
    value = '#ffffff';
    $('#colorinput').val(value);
    $('#colorinput').next().children().css('background-color',value);
    $('#cp3').colorpicker('setValue', value);
    $('#cp3').colorpicker('show');
    return false;
});

在此处查看示例代码：http: //jsfiddle.net/bimaljr/xtSrq/14/

我想从外部链接设置颜色选择器的颜色。当您单击“设置颜色”链接时，它将更改输入框的值和框的颜色。但是，在那之后，当您单击颜色框打开颜色选择器时，它将显示旧颜色。我想用“值”字符串中的颜色设置它。

目前它给出错误“无法调用未定义的方法'toLowerCase'”。我认为“值”字符串不是通过 setColor() 或 .colorpicker('setValue', value) 函数传递的。

4

1 回答 1

2

我认为这是颜色选择器代码中的错误。当你打电话时.colorpicker('setValue', value)。你的价值永远不会被使用。

第 349 行：

$.fn.colorpicker = function ( option ) {
    return this.each(function () {
        var $this = $(this),
            data = $this.data('colorpicker'),
            options = typeof option === 'object' && option;
        if (!data) {
            $this.data('colorpicker', (data = new Colorpicker(this, $.extend({}, $.fn.colorpicker.defaults,options))));
        }
        if (typeof option === 'string') data[option]();
    });

当您将其更改为（向函数添加第二个参数）时，您的问题似乎已解决：

$.fn.colorpicker = function ( option, value) {
    return this.each(function () {
        var $this = $(this),
            data = $this.data('colorpicker'),
            options = typeof option === 'object' && option;
        if (!data) {
            $this.data('colorpicker', (data = new Colorpicker(this, $.extend({}, $.fn.colorpicker.defaults,options))));
        }
        if (typeof option === 'string') data[option](value);
    });
于 2013-04-11T10:48:30.373 回答