0

나는 시간을 새 timepicker를 작동 시키려고 노력했다. (이전에는 https://github.com/weareoutman/clockpicker이 좋았지 만 언제나 휴대 전화의 스크린에서 벗어났다.)입력란의 클릭으로 투구를 할 수 있습니까?

대부분 부트 스트랩 2.x에 대한 것으로 보이며 작동하지 않습니다. 마지막으로 (모바일에 큰되지하지만 ...)가는 https://github.com/Eonasdan/bootstrap-datetimepicker

내 문제는 그래서는 glyphicon 없애 필요가 그냥 onclickinput 필드 자체에 내가 날짜에 대한 작은 input 필드의 제비가있다을 얻었다.

다른 누군가가 고심하고있는 경우를 대비하여 테스트 페이지를 포함 시켰습니다. 나는 내가 순간을 필요로한다는 것을 깨닫지 못했다. js와 그것은 나에게 매우 자극적 인 30 분을 들게했다.

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <link type="text/css" rel="stylesheet" href="/beta022/bootstrap/css/bootstrap.css" /> 
     <link type="text/css" rel="stylesheet" href="/beta022/bootstrap/css/bootstrap-datetimepicker.css" /> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
     <script type="text/javascript" src="/beta022/bootstrap/js/moment.js"></script> 
     <script type="text/javascript" src="/beta022/bootstrap/js/bootstrap.js"></script>   
     <script type="text/javascript" src="/beta022/bootstrap/js/bootstrap-datetimepicker.min.js"></script> 
    </head> 
    <body> 
<div class="container"> 

    <div class="row"> 
     <div class='col-sm-6'> 
      <form class="form"> 
      <div class="form-group"> 
       <div class='input-group date' id='datetimepicker4'> 
        <input type='text' class="form-control" /> 
        <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span> 
        </span> 
       </div> 
      </div> 

     </form> 
     </div> 
     <script type="text/javascript"> 
      $(function() { 
       $('#datetimepicker4').datetimepicker({ 
        pickDate: false, minuteStepping:5, 
       }); 
      }); 
     </script> 
    </div> 
</div>   
</html> 

편집 :이 이상한 벗어납니다. glyphicon 없애 버려. 다른 spaninput 주변에 놓습니다. 작동하지만 큰 못생긴 국경. input-group-addonclass을 adxxdon으로 변경하여 완벽하게 작동하지 않도록 시도했습니다 (둥근 모서리가 없음). 그런 다음 시도하지 않고 그 class 그리고 그만 작동합니다. 그래서 어떤 종류의 regexspan 내에서 발생하는 것 같습니다.

저는 JS/CSS 능력의 끝에 있습니다. 누구든지 깔끔한 해결책을 가지고 있다면 나는 감사 할 것입니다.

답변

1

쉽습니다. 그냥이 속성을 true로 설정 // 경우 그냥

<script type="text/javascript"> 
     $(function() { 
      $('#datetimepicker4').datetimepicker({ 
       pickDate: false, 
       minuteStepping:5, 
       allowInputToggle: true 
      }); 
     }); 
</script> 

allowInputToggle: true 다음과 같이 자바 스크립트에서 하나 개의 속성을 사용하는 문서 :

http://eonasdan.github.io/bootstrap-datetimepicker/#example6

+0

감사합니다. (gals). 그걸 전혀 보지 못했어요. – BeNice

0

을 참조,이에있는 DateTimePicker 드롭 다운의 개방 을 허용합니다 두 아이콘 모두 입력란에서을 클릭하여 을 클릭하십시오.

관련 문제