JS Timepicker设置和谐的最小和最大时间

问题描述：

我有一个timepicker从http://amsul.ca/pickadate.js/time/JS Timepicker设置和谐的最小和最大时间

有两种情况，开始和结束：

<div align="center"> 
    <span class="glyphicon glyphicon-time"></span> 
    <label for="start_time">Start</label> 
    <input name="start_time" id="start_time"> 
    <p></p> 
    <span class="glyphicon glyphicon-time"></span> 
    <label for="finish_time">Finish</label> 
    <input name="finish_time" id="finish_time"> 
</div>

的JS设置最小和最大时间：

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#start_time').pickatime({ 
     //format: 'h:i A',   // Displayed and application format 
     formatSubmit: 'HH:i:00', 
     hiddenName: true, 
     interval: 15,    // Interval between values (in minutes) 
     min: '3:00 AM',    // Starting value 
     max: '6:00 PM'    // Ending value 
     //finish_time.set('min': start_time) 
    }); 

    $('#finish_time').pickatime({ 
     //format: 'h:i A',   // Displayed and application format 
     formatSubmit: 'HH:i:00', 
     hiddenName: true, 
     interval: 15,    // Interval between values (in minutes) 
     min: '3:00 AM',   // Starting value 
     max: '6:00 PM'    // Ending value 
    }); 
}); 
</script>

我想要做的是将start_time选择器的最小开始时间设为3:00 AM，但对于finish_time选择器最小值无论w选为start_time + 15min。你会如何去做这件事？

这个插件有一个方法名_onSet_。所以你可以在_start_time_元素上使用它来设置_finish_time_元素的_min_值。但我认为你必须计算_start_time_值+ 15min是否在第二天！ – EhsanT

所以在start_time，我添加set：updateMin（）\t function updateMin（）{ \t \t $（'＃finish_time'）。setAttribute（min，$（“＃start_time”）。value）; \t} – Aaron

如果您没有注意到，我昨天发布了答案！ – EhsanT

答

好的，你的代码会是这样的，但正如我在我的评论中提到的，你必须检查start_time + 15min是否在第二天。

HTML

<div align="center"> 
    <span class="glyphicon glyphicon-time"></span> 
    <label for="start_time">Start</label> 
    <input name="start_time" id="start_time"> 
    <p></p> 
    <span class="glyphicon glyphicon-time"></span> 
    <label for="finish_time">Finish</label> 
    <input name="finish_time" id="finish_time"> 
</div>

的JavaScript

$(document).ready(function(){ 
    var finish_time = $('#finish_time').pickatime({ 
     //format: 'h:i A',   // Displayed and application format 
     formatSubmit: 'HH:i:00', 
     hiddenName: true, 
     interval: 15,    // Interval between values (in minutes) 
     min: '3:00 AM',   // Starting value 
     max: '6:00 PM'    // Ending value 
    }); 

    var start_time = $('#start_time').pickatime({ 
     //format: 'h:i A',   // Displayed and application format 
     formatSubmit: 'HH:i:00', 
     hiddenName: true, 
     interval: 15,    // Interval between values (in minutes) 
     min: '3:00 AM',    // Starting value 
     max: '6:00 PM',    // Ending value 
     onSet: function(context) { 
      var finish_time_min = context.select + 15; 
      var hours = Math.floor(finish_time_min/60); 
      var minutes = (finish_time_min - (hours * 60)); 
      finish_time.pickatime('picker').set('min', [hours, minutes]); 
     }     
    }); 
});

JS Timepicker设置和谐的最小和最大时间

相关推荐