jQuery UI Slider - Value returned from 'slide&

2019-01-26 09:45发布

问题:

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

回答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.



回答2:

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

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

And you're good to go



回答3:

Use ui.value in the slide handler to get a more accurate value.



回答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.