1

我的滑块值有问题。我希望 var R、G 和 B 随滑块而变化。目前它们只有在我停止使用滑块后才会改变。有任何想法吗？

var R = $("#RSlider").slider('value');
var G = $("#GSlider").slider('value');
var B = $("#BSlider").slider('value');

var colour = R + 256 * G + 65536 * B;
document.getElementById('color').innerHTML = colour.toString(16);

$("#BSlider").slider({
value: props["col1"].toFixed(2).replace('-',''),
step: 5,
min: 100,
max: 255,
slide: function(event, ui) {
}
});

$("#GSlider").slider({
value: props["col2"].toFixed(2).replace('-',''),
step: 5,
min: 100,
max: 255,
slide: function(event, ui) {
}
});

$("#RSlider").slider({
    value: props["col3"].toFixed(2).replace('-',''),
step: 5,
min: 100,
max: 255,
slide: function(event, ui) {                    
}

});

4

1 回答 1

2

好吧，我假设您使用的是 jQuery UI。如果是这样，您只需要使用“幻灯片”回调，而不是您现在使用的空函数。

function print_color() {
    var R = $("#RSlider").slider('value');
    var G = $("#GSlider").slider('value');
    var B = $("#BSlider").slider('value');

    var colour = R + 256 * G + 65536 * B;
    //document.getElementById('color').innerHTML = colour.toString(16);
    $('#color').html(colour.toString(16));
}

$("#BSlider").slider({
    //These are giving me errors and I'm not sure what they do, so I'm commenting them out.
    //value: props["col1"].toFixed(2).replace('-', ''),
    step: 5,
    min: 100,
    max: 255,
    slide: print_color
});

$("#GSlider").slider({
    //value: props["col2"].toFixed(2).replace('-', ''),
    step: 5,
    min: 100,
    max: 255,
    slide: print_color
});

$("#RSlider").slider({
    //value: props["col3"].toFixed(2).replace('-', ''),
    step: 5,
    min: 100,
    max: 255,
    slide: print_color
});

print_color();

小提琴，如果你想要的话：http: //jsfiddle.net/luhn/5b4Kc/

于 2012-04-27T00:00:05.303 回答