在 Jquery Dynamic Timepicker 中限制开始时间和结束时间答案

【问题标题】：Restrict Starttime and endtime in Jquery Dynamic Timepicker在 Jquery Dynamic Timepicker 中限制开始时间和结束时间
【发布时间】：2014-05-28 12:17:35
【问题描述】：

我使用了下面链接中给出的时间选择器插件，

https://fgelinas.com/code/timepicker/

我有开始时间和结束时间以及添加按钮。当用户单击添加按钮时，会出现另一个开始和结束时间文本框。在这些文本框中，我设置了您的代码中提到的按时间顺序排列的时间范围。

但是在编辑过程中，我使用了下面的代码，

$('.tpicker1').each(function () {
            if ($(this).hasClass('hasTimepicker')) {
                $(this).removeClass('hasTimepicker');
            } 

                $(this).timepicker({
                showLeadingZero: false,
                onSelect: function( time, endTimePickerInst ) {

                $(document).on('focus','.tpicker2', function(){
                $(this).timepicker('option', {                  
                minTime: {
                hour: endTimePickerInst.hours,
                minute: endTimePickerInst.minutes
                }
                });
            });
            },
                minTime: {
                    hour: 10, minute: 00
                }
            });
           });
           $('.tpicker2').each(function () {
            if ($(this).hasClass('hasTimepicker')) {
                $(this).removeClass('hasTimepicker');
            } 
             $(this).timepicker({
                showLeadingZero: false,
                onSelect: function( time, startTimePickerInst ) {
                $(document).on('focus','.tpicker1', function(){
                $(this).timepicker('option', {                  
                maxTime: {
                hour: startTimePickerInst.hours,
                minute: startTimePickerInst.minutes
                }
                });
            });
            },
            });
           });

在此代码中，假设有 4 个时间选择器，即 starttime1、endtime1、starttime2、endtime2 等。tpicker1 为 starttime，tpicker2 为 endtime。如果我选择 starttime1，endtime1 是基于 starttime1 的阻塞时间。但是如果我选择starttime2和endtime2然后转到starttime1，starttime的最大时间显示基于endtime2而不是endtime1。帮我解决这个问题.....

【问题讨论】：

那么你应该使用 ID 选择器而不是类选择器。我想您在所有开始时间都使用相同的类 tpicker1。
如果我们有很多时间选择器，例如 20，那么我怎么能使用 ID。我尝试循环以防 ID，但我无法阻止 mintime 和 maxtime。
你必须在运行时根据你点击的开始时间传递 id

标签： jquery timepicker

【解决方案1】：

类似这样，我提供了一个非常基本的解决方案，如果你想传递多个参数，就像你喜欢的那样

这可以用多种方式编写。如果您不需要该功能，只需将其内联

    function restricEndtime(id)
    {
        now you have the id here
        do whatever you want to do here 
    }

你有这样的点击开始时间

$('.tpicker1').click(function(){
     restricEndtime($(this).attr('id'));
});

【讨论】：