jQuery UI Slider - Value returned from 'slide' event on release is different from 'change' value

Question

I have a jQuery UI slider:

$('div.slider').slider({
    range: true,
    step: 250,
    min: 1000,
    max: 500000,
    values: [1000,500000],
    change: function(event, ui){
        console.log($(this).slider('values', 0)+','+$(this).slider('values', 1));
    },
    slide: function(event, ui){
        console.log($(this).slider('values', 0)+','+$(this).slider('values', 1));
    }
});

For some odd reason, when releasing the slider (mouseup) the value changes slightly from what it was. The slide event is returning something different than what the change event is. Anyone have any ideas what might be causing this and how I could solve it?

I'm going to have a pretty intense operation in the callback for the change event (meaning I can't just use sldie), but also need to show the values of the slider live, so I can't use just one or the other.

Here's a fiddle with this oddity in action: http://jsfiddle.net/5W6Zh/

Thanks in advance

Answer 1

we ran into this tonight (and last night, and for the past few months). What we did to fix it was use ui.value and ui.values[0] instead of $("#slider").slider('values',0).

Use this:

change: function(event, ui) {
  $('.values').text(ui.values[0] + ',' + ui.values[1]);
}

Instead of:

change: function(event, ui) {
  $('.values').text($(this).slider('values', 0) + ',' + $(this).slider('values', 1));
}

I forked your jsfiddle and made it work: http://jsfiddle.net/danhixon/9JdhU/1/

Honestly I don't think I would have found the solution without your question and jsfiddle - I kept comparing it to the jquery-ui demo until I found this difference.

Answer 2

I found a solution! ALWAYS do this on a slide event:

$(this).slider('value', ui.value);

And you're good to go

Answer 3

在幻灯片处理程序中使用ui.value以获得更准确的值。

Answer 4

Your min, max and step values look a bit weird, but I guess you just got them mixed up.

I found that the slider doesn't work too well with steps much smaller than 1, so I changed to use integers only and divide afterwards. Never had any problems since then.