3

00:00:10 から 01:30:00 までの範囲のビデオの長さのスライダーが必要です。ミリ秒単位で期間を取得し、ミリ秒単位で送信する必要があります。noUiSlider.create2 つの書式設定関数とupdateイベント ハンドラーを使用して を呼び出しています。

var timeSlider = document.getElementById('timelineranger');

noUiSlider.create(timeSlider, {
    start: [10000, 5400000],
    connect: true,
    behaviour: 'tap-drag',
    step: 10000,
    range: {
        'min': 10000,
        'max': 5400000
    },
    format: {
        to: HHMMSSToms,
        from: msToHHMMSS
    }
});

function msToHHMMSS(value) {
    var duration = moment.duration(parseInt(value, 10));
    var addZero = function(v) { return (v<10 ? '0' : '') + Math.floor(v); };

    var time = addZero(duration.hours()) +
        ':' + addZero(duration.minutes()) +
        ':' + addZero(duration.seconds());
    return time;
}

function HHMMSSToms(value) {
    var a = value.toString().split(':');
    var ms = (+a[0]) * 60 * 60 + (+a[1]) * 60 + (+a[2]) * 1000;
    return ms;
}

timeSlider.noUiSlider.on('update', function (values, handle) {
    if (handle) {
        $('.timeMax').text(values[handle]);
    } else {
        $('timeMin').text(values[handle]);
    }
});

問題は、msToHHMMSS関数が の値で 3 回呼び出され10000、次に 5400000でもう一度呼び出されてから、 の値で呼び出され、エラーをスローすることです: 。10000HHMMSSTomsundefinedCannot read property 'split' of undefined

この質問を見てきましたが、最初に言ったように、hh:mm:ssフォーマットが必要です。

4

1 に答える 1