jquery旋钮显示输入完成答案

【问题标题】：jquery knob display input on completejquery旋钮显示输入完成
【发布时间】：2015-03-02 10:14:14
【问题描述】：

我正在使用 jquery 旋钮以图形方式表示我的数据。

我试图仅在动画之后显示输入值（在圆圈的中心），但我没有找到如何。我的做法是最初将'displayInput'设置为false，并在动画完成后使用完整的功能将其设置为true。我可以看到它适用于 fgColor 属性，但不适用于 displayInput 属性。

elm.knob({
    'width': 60,
    'height': 60,
    'min': 0,
    'max': 6,
    'step': 0.1,
    'readOnly': true,
    'thickness': .5,
    'dynamicDraw': true,
    'displayInput': false,
    'fgColor': dangerLevelColor,
    'inputColor': '#7F8C8D',
    format: function (value) {
        return value + '/6';
    }
});
$({value: 0}).animate({value: dangerLevel}, {
    duration: 1500,
    easing: 'swing',
    progress: function () {
        elm.val(this.value).trigger('change');
    },
    complete: function () {
        elm.trigger(
                'configure', {
                    'displayInput': true,
                    'fgColor': 'green'
                });
    }
});

有什么想法吗？谢谢！！

【问题讨论】：

标签： javascript jquery canvas jquery-knob

【解决方案1】：

我遇到了类似的问题。似乎是某种类型的错误，但我无法追踪它。它反向工作（从 displayInput: true 开始，稍后使用 configure 更改为 false）。我所做的解决方法是将 displayInput 设置为 true 并使用 inputColor 选项将其“隐藏”，方法是将其设置为与背景相同的颜色，并在您想要显示它时设置为其他可见颜色。

初始化隐藏（在白色背景上）

 $(".knob").knob({ 'inputColor': '#FFFFFF' });

显示

$(".knob").trigger('configure', { 'inputColor': '#87CEEB' });

【讨论】：