Question

我在滑块栏上尝试将24小时格式时间转换为12小时格式时遇到了一些问题。这是我的jsfiddle。正如您所看到的，当您尝试从上午到下午以一种方式滑动时，它运行得很好。

但是，一旦它到达PM并且你滑回AM，它就会一直显示为PM。我无法通过滑块修改值，因为我有一些数据库取决于它。我可以修改的唯一部分是我尝试在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

为什么要改变日常工作中的小时值？使用单独的值，如

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

Answer 2

请试用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);
    }
});

}）;

Answer 3

JsFiddle

$(function() {
    $('#sliderValue').html('12:00AM');
    $("#slider-range").slider({       
        min: 0,
        max: 1380,
        step: 60,
        slide: function(e, ui) {
            var ext = 'AM';
            var hours = Math.floor(ui.value / 60);
            if(hours > 12){
                ext = 'PM';
            }
            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 == 0){
                hours = 12;
            }
            $('#sliderValue').html(hours+':'+minutes + ext);
        }
    });
});

Answer 4

你从来没有检查过相反的方式，你需要这样做：

// Convert 24 hours format into 12
if(hours < 12)
{
    ext = 'AM';

    if(hours == 0)
    {
        hours = 12;
    }
}

else
{
    ext = 'PM';   

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

http://prntscr.com/5qmrs7

Answer 5

你从不为0到12之间的小时指定AM后缀。因此，当滑块从PM部分返回时，它永远不会更新并保持为PM（直到你将它放回到0，至少）。

添加

部分

if(hours > 0 && hours < 12){
      ext = 'AM';
}

你应该得到预期的结果。

滑块栏将24小时时间格式转换为12小时

5 个答案: