javascript - 将 slider 的 24 小时时间格式转换为 12 小时

Question

尝试在 slider 上将 24 小时格式时间转换为 12 小时格式时遇到一些问题。这是我的jsfiddle 。正如您所看到的，当您尝试以一种方式从上午滑到下午时，效果非常好。

但是，一旦到达 PM 并且您滑回 AM，它就一直显示为 PM。我无法通过 slider 修改该值，因为我有一些依赖于它的数据库。我唯一可以修改的部分是我尝试在 sliderValue 上显示它的位置，这就是这部分:

// Convert 24 hours format into 12
        if(hours == 0){
            hours = 12;
            ext = "AM";
        }
        if(hours == 12){
            ext = "PM";
        }
        if(hours > 12){
            hours = hours - 12;
            ext = 'PM';
        }

        $('#sliderValue').html(hours+':'+minutes + ext);

有什么指南吗？提前致谢。

Answer 1

请试试这个fiddle

   $(function() {
    var ext = 'AM';
    $('#sliderValue').html('12:00AM');
    $("#slider-range").slider({       
    min: 0,
    max: 1380,
    step: 60,
    slide: function(e, ui) {
        var hours = Math.floor(ui.value / 60);
        var minutes = ui.value - (hours * 60);

        if(hours.length == 1) hours = '0' + hours;
        if(minutes.length == 1) minutes = '0' + minutes;
        if(minutes==0)minutes = '00';

        // Convert 24 hours format into 12


        if(hours >= 12){
            ext = 'PM';
        }
        else{
            ext = 'AM';
        }

        if(hours>12){
            hours = hours - 12;
        }

        $('#sliderValue').html(hours+':'+minutes + ext);
    }
});

});