Jquery UI滑块在页面加载时显示时间格式?

时间:2013-06-04 13:53:36

标签: jquery

您好我已经使用jquery UI中的幻灯片粘贴了一些创建时间输入的代码。代码工作正常,但是当首次加载页面时,值显示数字值而不是hh:mm。谁能告诉我怎么做?

$(function() {

    $("#sliderTime2").slider({
        range: false,
        value: 720,
        min: 0,
        max: 1425,
        step: 15,
        slide: function(e, ui) {
            var hours = Math.floor(ui.value / 60);
            var minutes = ui.value - (hours * 60);
            if(hours < 10) hours = '0' + hours;
            if(minutes < 10) minutes = '0' + minutes;
            $('#sliderTimeDis2').val(hours+':'+minutes);
        }
    });

     $("#sliderTimeDis2").val($("#sliderTime2").slider("value"));

});

1 个答案:

答案 0 :(得分:0)

你的问题是你正在加载滑块的值,这将是div的整数。

你会想要这样的东西:

$(function() {

   $("#sliderTime2").slider({
      range: false,
      value: 720,
      min: 0,
      max: 1425,
      step: 15,
      slide: function(e, ui) {
         updateTimeDisplay(ui.value);
      },
      create: function(e, ui) {
         //this should work
         updateTimeDisplay($(this).option('value'));
      }
   });

   var updateTimeDisplay=function(timeVal)
   {
      var hours = Math.floor(timeVal / 60);
      var minutes = timeVal - (hours * 60);
      if(hours < 10) hours = '0' + hours;
      if(minutes < 10) minutes = '0' + minutes;
      $('#sliderTimeDis2').val(hours+':'+minutes);
   }

});