minicolors 不适用于 css-value 透明答案

【问题标题】：minicolors not working with css-value transparentminicolors 不适用于 css-value 透明
【发布时间】：2013-11-21 01:51:40
【问题描述】：

我对其他出色的插件 minicolors 有疑问。当我想使用 css-value 'transparent' 时，它以两种不同的方式来处理两个对象的看似相同的处理。它在第一种情况下运行良好，而在第二种情况下则不行。我不能使用 rgba 方式来使用透明度是有原因的。我知道 minicolors 中的颜色选择器无法显示透明度，我想要的只是停止将表单字段 data_11 的值“透明”转换为十六进制。

首先我有一个表单字段 data_0，我用 minicolors 初始化（它使用 INPUTs value='transparent' 设置为透明）

$('#data_0').minicolors({
    control: 'hue',
    defaultValue: $('#data_0').val(),
    hide: null,
    hideSpeed: 100,
    inline: false,
    letterCase: 'uppercase',
    opacity: false,
    position: 'default',
    show: null,
    showSpeed: 100,
    swatchPosition: 'left',
    textfield: true,
    theme: 'default',
    changeDelay: '100',
    change: function(hex) {
        //console.log(hex + ' - ' + opacity);
        $('#slide_bg').css('backgroundColor', hex);
        $('#slide_bg').css("background-color", hex);    
    }
});

然后我在代码的下方有一个 data_11，同样的，设置为透明，调试显示在我用 minicolors 初始化它之前它的值是“透明”。

我这样初始化它：

$('#data_11').minicolors({
    control: 'hue',
    defaultValue: null,//getDefaultMinicolor( '{{ data11 }}' ),
    hide: null,
    hideSpeed: 100,
    inline: false,
    letterCase: 'uppercase',
    opacity: false,
    position: 'default',
    show: null,
    showSpeed: 100,
    swatchPosition: 'left',
    textfield: true,
    theme: 'default',
    changeDelay: '100',
    change: function(hex) {
        //console.log(hex + ' - ' + opacity);
        $('#preview_title').css('backgroundColor', hex);
        $('#preview_title').css("background-color", hex);    
    }
});

现在调试显示，在我用 minicolors 初始化 data_11 后，它的值不再是“透明”而是“#AAAAEE”，我认为它在某种程度上相当于字符串“透明”的十六进制。

所以我完全不明白，他们的行为怎么不一样？

defaultValue 对任何一个都没有影响。

【问题讨论】：

标签： jquery forms colors

【解决方案1】：

好的，这就是我解决问题的方法。但我仍然不喜欢以这种方式破解我自己的应用程序......如果问题出在我的代码中，我会很高兴发现。

$('#data_11').minicolors({
    control: 'hue',
    defaultValue: 'nada',//getDefaultMinicolor( '{{ data11 }}' ),
    hide: null,
    hideSpeed: 100,
    inline: false,
    letterCase: 'uppercase',
    opacity: false,
    position: 'default',
    show: null,
    showSpeed: 100,
    swatchPosition: 'left',
    textfield: true,
    theme: 'default',
    changeDelay: '100',
    change: function(hex) {
        //console.log(hex + ' - ' + opacity);
        $('#preview_title').css('backgroundColor', hex);
        $('#preview_title').css("background-color", hex);    
    }
});
{% if data11 == 'transparent' %}
{# Due to some bug we need to hack the initialization of this colorpicker... strangely we don't need to with the first bg-color-picker (data0) #}
$('#data_11').val('transparent');
{% endif %}

【讨论】：