IonDen / ion.rangeSlider

jQuery only range slider
http://ionden.com/a/plugins/ion.rangeSlider/en.html
MIT License
2.56k stars 508 forks source link

when use update method real time. the onchange is not working #669

Open quanfuxia888 opened 4 years ago

quanfuxia888 commented 4 years ago
$("#play_process_slider").ionRangeSlider({
        min: 0,
        max: 100,
        from: 0,
        skin: "big",
        keyboard:false,
        hide_min_max:true,
        hide_from_to:true,
         onChange:function (e) {
            console.log(e.from);
             audioJs.currentTime = e.from;
            play();
        }
    });
var myRange = $("#play_process_slider").data("ionRangeSlider");
currentTime=0;
setInterval(function () {
            myRange.update({from:currentTime,to:currentTime+0.1});
        },100);

the onChange is not working

IonDen commented 4 years ago

Hi, you should use onUpdate method to check that.

quanfuxia888 commented 4 years ago

Hi, you should use onUpdate method to check that.

Hi , Thanks for you answer. Maybe I didn't descript my question well. the question is bellow: in the code block. I use update method ,because I want the slider move by time. When I click the slider in other postion , I want it can move the postion. So I use the change method.

quanfuxia888 commented 4 years ago

Hi, you should use onUpdate method to check that.

like audio, when I click somewhere, the slider can move the place.

IonDen commented 4 years ago

Yes yes, look here:

$("#play_process_slider").ionRangeSlider({
    min: 0,
    max: 100,
    from: 0,
    skin: "big",
    keyboard: false,
    hide_min_max: true,
    hide_from_to: true,
    onChange: onChange,
    onUpdate: onChange // this will react on `update` calls
});

var myRange = $("#play_process_slider").data("ionRangeSlider");
var currentTime = 0;

function onChange (data) {
    console.log(data.from);
    audioJs.currentTime = data.from;
    play();
}

setInterval(function() {
    myRange.update({
        from: currentTime,
        to: currentTime + 0.1
    });
}, 100);