如何在 jQuery-timepicker 中设置不同的开始步长值?

How to set different begin step value in jQuery-timepicker?

我正在使用jQuery-timepicker for selecting time in select input fields. Depending on selection in Start input, End input field will have minimum time 15 minutes from the Start field. How can I specify that step should start from 15 min in second input?

http://jsfiddle.net/Lqj858o0/1/

var timepickerStart = $('#timepicker-start');

    var timepickerEnd = $('#timepicker-end');

    // Properties for End time
    timepickerEnd.timepicker({
        'timeFormat': 'H:i',
        'minTime': '7:00am',
        'maxTime': '9:00pm',
        // This step should remain at 15, but it shouldn't start from 0 but from 15
        'step': 15,
        'showDuration': true
    });

    // Properties for Start time
    timepickerStart.timepicker({
        'timeFormat': 'H:i',
        'minTime': '7:00am',
        'maxTime': '10:00pm',
        'step': 15,
        'lang': {
            mins: 'min',
            hrs: 'hr'
        }
    }).on('changeTime', function(){

      // When Start time is changed, get start time value and add 15 minutes to it
      var selectedStartTime = timepickerStart.val();
      var minimumStartTime = moment(selectedStartTime, ["h:mm"]).add(15, 'minutes').format('hh:mm');

        // Set new value for End time
        timepickerEnd.timepicker('option', { 
            'minTime': minimumStartTime + 'am',
            'timeFormat': 'H:i'
        });

    });

您需要的是 durationTime - timepicker 的 属性,它设置计算 showDuration 所依据的小时。如果您不指定它,它将自己设置为等于 minTime,这就是您的问题所在。

这样使用:

// When Start time is changed, get start time value and add 15 minutes to it
  var selectedStartTime = timepickerStart.val();
  var minimumStartTime = moment(selectedStartTime, ["h:mm"]).add(15, 'minutes').format('hh:mm');

// Set new value for End time
    timepickerEnd.timepicker('option', { 
    'durationTime': selectedStartTime, // <- This is the line I added.
    'minTime': minimumStartTime + 'am',
    'timeFormat': 'H:i'
    });