6

我正在使用 Jquery Timepicker 。

我有两个输入字段 - 接受时间。

<input id="startTime"  size="30" type="text" />
<input id="endTime"  size="30" type="text" />

根据文档,我正在使用 Jquery UI 计时器

$('#startTime').timepicker({
    'minTime': '6:00am',
    'maxTime': '11:30pm',
    'onSelect': function() {
        //change the 'minTime parameter of #endTime <--- how do I do this ?
     }
});
$('#endTime').timepicker({
    'minTime': '2:00pm',
    'maxTime': '11:30pm',
    'showDuration': true
});

我希望当第一个 timePicker 被选中时,第二个的 'minTime' 参数会被改变。基本上我正在尝试收集某些活动的开始时间和结束时间。我希望第二个输入框显示第一个输入字段(开始时间)本身的值的选项。

4

3 回答 3

10

你会做这样的事情,

$('#startTime').timepicker({
                'minTime': '6:00am',
                'maxTime': '11:30pm',
                    'onSelect': function() {

                    $('#endTime').timepicker('option', 'minTime', $(this).val());                        
              }
            });

您在这里所做的是,在 的onSelect函数中#startTime,您将选项minTime#endTime值设置为#startTime

看到这个JS Fiddle

于 2012-06-09T04:43:35.157 回答
10

您可以参加 onchange 活动:

        $('#startTime').timepicker();

        $('#endTime').timepicker({
            'minTime': '12:00am',
            'showDuration': true
        });

        $('#startTime').on('changeTime', function() {
            $('#endTime').timepicker('option', 'minTime', $(this).val());
        });

我修改了第一个回复中发布的代码,这里是它的工作小提琴http://jsfiddle.net/NXVy2/215/

你也可以使用 on('change'...

    $('#startTime').on('change', function() {
        $('#endTime').timepicker('option', 'minTime', $(this).val());
    });
于 2016-09-05T15:26:19.247 回答
4

jQuery-UI 小部件通常支持一种options允许您更改现有实例上的选项的方法。通过提供一个字符串作为插件调用的第一个参数来调用小部件方法:

$(...).widget_name('method_name', arg...)

所以这应该适合你:

$('#endTime').timepicker('option', 'minTime', new_min_time)
于 2012-06-09T04:55:29.690 回答