jquery 또는 독립형 js에 적합한 시간 선택기는 무엇입니까? 15 분 간격으로 일반적인 시간 드롭 다운이 있거나 시간을 수동으로 입력하고 유효성을 검사하는 캘린더에서 Google과 같은 것을 사용하고 싶습니다.
jquery 또는 독립형 js에 적합한 시간 선택기는 무엇입니까? 15 분 간격으로 일반적인 시간 드롭 다운이 있거나 시간을 수동으로 입력하고 유효성을 검사하는 캘린더에서 Google과 같은 것을 사용하고 싶습니다.
답변:
몇 가지 리소스 :
이것은 http://trentrichardson.com/examples/timepicker/ 까지 내가 찾은 최고입니다.
다음은 Twitter Bootstrap과 함께 작동하는 것입니다.
제안 된 시간 선택 도구가 마음에 들지 않았기 때문에 Perifer와 HTML5 사양에서 영감을 받아 직접 만들었습니다.
http://github.com/gregersrygg/jquery.timeInput
당신이 중 하나를 사용할 수있는 새로운 HTML5 속성 시간을 입력한다 (단계, 최소, 최대)를 들어, 또는 옵션의 객체를 사용 :
<input type="time" name="myTime" class="time-mm-hh" min="9:00" max="18:00" step="1800" />
<input type="time" name="myTime2" class="time-mm-hh" />
<script type="text/javascript">
$("input[name='myTime']").timeInput(); // use default or html5 attributes
$("input[name='myTime2']").timeInput({min: "6:00", max: "15:00", step: 900}); // 15 min intervals from 6:00 am to 3:00 pm
</script>
다음과 같이 입력을 확인합니다.
HTML5 사양은 am / pm 또는 현지화 된 시간 구문을 허용하지 않으므로 hh : mm 형식 만 허용합니다. 사양에 따라 초가 허용되지만 아직 구현하지 않았습니다.
매우 "알파"이므로 버그가있을 수 있습니다. 나에게 패치 / 풀 요청을 보내 주시기 바랍니다. IE 6 & 8, FF, Chrome 및 Opera에서 수동으로 테스트했습니다 (후자의 경우 Linux에서 최신 안정).
여기에서 jQuery 작성자 John Resig의 게시물을 읽을 수 있습니다. http://ejohn.org/blog/picking-time/ .
나는 ClockPick을 사용 하고 있습니다.
누군가 다른 JavaScript TimPicker에 관심이있는 경우 작업을 수행하는 jQuery 플러그인을 개발하고 유지 관리합니다. EZ Time JS와 같은 방식으로 작동합니다 (5 분 전까지는 몰랐지만 : D). 사용자가 편안하게 느끼는 거의 모든 방식으로 시간을 입력하고 입력을 공통 형식으로 변환 할 수 있습니다.
체크 아웃 jQuery를 TimePicker 옵션 페이지를 행동에서 볼 수 있습니다.
NoGray는 멋진 눈 사탕이지만 몇 가지 사용성 고려 사항이 있습니다. 첫째, 아날로그 시계는 점점 더 모호 해지고 있으며 젊은 사람들은 때때로 시계를 읽는 데 어려움을 겪습니다. 둘째, 슬라이더를 사용하는 시간 선택기와 마찬가지로 마우스로 특정 시간으로 드래그하는 것은 약간 지루합니다. 셋째,이 선택기에 대한 키보드 상호 작용은 약간 산발적입니다.
더 유용한 시간 선택 도구는 Any + Time ™ Datepicker / Timepicker AJAX 캘린더 위젯을 확인하십시오 . 간단한 버튼을 사용하여 빠르고 쉽게 특정 시간을 선택하기 때문에 사용 가능한 가장 빠르고 사용하기 쉬운 시간 선택 도구 일 것입니다.
사용성에 대한 흥미로운 테스트는 다음과 같습니다. 이상한 시간 (예 : 10:32 pm)을 선택한 다음 다양한 시간 선택기를 사용하여 해당 시간을 정확하게 선택하는 데 걸리는 시간을 확인합니다. Any + Time ™을 사용하면 시간을 직접 적는 것보다 더 빨리 할 수 있습니다. 다른 선택기를 찾아보세요! 말할 것도없이 Any + Time ™은 수많은 다양한 날짜 / 시간 형식, 12/24 시간제, 전체 CSS (또는 jQuery UI) 사용자 지정 및 시간대까지 지원합니다!