-2

viewMode 옵션을 '년'으로 설정하면 키보드 키를 사용하여 몇 년 사이를 탐색 할 수 없으며 기본 선택 연도에서 Enter 키를 눌러도 위젯이 자동으로 닫힙니다. '개월'viewMode 다음 '일'viewMode으로 이동해야합니다.viewMode에서 키보드 탐색이 비활성화되었습니다. datetimepicker

왜 클릭에서 작동하지만 키보드 탐색에서는 작동하지 않는지 알 수 있습니까?

미리 감사드립니다. 내가이 문제를 해결하기 위해 무슨 짓을

답변

0

는 현재 뷰 모드에 따라 키를 리 바인드이며, 동일한 문제에 직면 누구를위한 솔루션을 여기에, 완벽하게 작동 있습니다 :

$('#birthday').datetimepicker(
    { 
     format: 'DD-MM-YYYY', 
     locale:'fr', 
     viewMode:'years' 
    }).on('dp.show',function(e) 
    { 
     document.removeEventListener("keydown", SubscripKeyDownHandler); 
     $(this).data("DateTimePicker").keyBinds({ 
      up: function (widget) { 
       if($('#birthday').data('DateTimePicker').viewMode()=="years") 
       { 
        // console.log('years'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().subtract(4, 'y')); 
        } else { 
         this.date(this.date().clone().add(1, 'h')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="months") 
       { 
        // console.log('months'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().subtract(4, 'M')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="days") 
       { 
        // console.log('days'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().subtract(7, 'd')); 
        } else { 
         this.date(this.date().clone().add(1, 'm')); 
        } 
       } 
      }, 
      down: function (widget) { 
       if($('#birthday').data('DateTimePicker').viewMode()=="years") 
       { 
        // console.log('years'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().add(4, 'y')); 
        } else { 
         this.date(this.date().clone().subtract(1, 'h')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="months") 
       { 
        // console.log('months'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().add(4, 'M')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="days") 
       { 
        // console.log('days'); 
        if (!widget) { 
         this.show(); 
        } 
        else if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().add(7, 'd')); 
        } else { 
         this.date(this.date().clone().subtract(1, 'm')); 
        } 
       } 
      }, 
      left: function (widget) { 
       if($('#birthday').data('DateTimePicker').viewMode()=="years") 
       { 
        // console.log('years'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().subtract(1, 'y')); 
        } else { 
         this.date(this.date().clone().add(1, 'h')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="months") 
       { 
        // console.log('months'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().subtract(1, 'M')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="days") 
       { 
        // console.log('days'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().subtract(1, 'd')); 
        } 
       } 
      }, 
      right: function (widget) { 
       if($('#birthday').data('DateTimePicker').viewMode()=="years") 
       { 
        // console.log('years'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().add(1, 'y')); 
        } else { 
         this.date(this.date().clone().subtract(1, 'h')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="months") 
       { 
        // console.log('months'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().add(1, 'M')); 
        } 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="days") 
       { 
        // console.log('days'); 
        if (widget.find('.datepicker').is(':visible')) { 
         this.date(this.date().clone().add(1, 'd')); 
        } 
       } 
      }, 
      enter: function (widget) { 
       if($('#birthday').data('DateTimePicker').viewMode()=="years") 
       { 
        setTimeout(function(){ 
         $('#birthday').data('DateTimePicker').viewMode('months'); 
         },1); 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="months") 
       { 
        setTimeout(function(){ 
         $('#birthday').data('DateTimePicker').viewMode('days'); 
         },1); 
       } 
       else if($('#birthday').data('DateTimePicker').viewMode()=="days") 
       { 
        this.hide(); 
       } 
       console.log($('#birthday').data('DateTimePicker').viewMode()); 
      } 
     }); 
    }).on('dp.hide',function(e) 
    { 
     //You can add this line of code to fix this issue: 
     //The year viewMode is set the first time you open the datetimepicker 
     //and can't be set if you opened it again 
     setTimeout(function(){ 
      $('#birthday').data('DateTimePicker').viewMode('years'); 
      },1); 
     document.addEventListener("keydown", SubscripKeyDownHandler); 
    }).on("dp.change", function (e) { 
    });