jQuery 시간 선택기

jQuery 시간 선택기

---

사용자가 15 분 간격으로 선택할 수있는 시간으로 텍스트 입력을 채우려 고합니다. 거기에 몇 가지 플러그인이 있다는 것을 알고 있습니다. "산업 표준"플러그인이 있는지 또는 일반적인 시나리오에서 특정 플러그인을 선호하는 강력한 객관적인 이유가 있는지 궁금합니다.

---

이 플러그인 ( github 저장소 )이 언급 된 다른 플러그인 보다 우수 하다는 것을 알았습니다 . Google 캘린더의 시간 선택기를 모방합니다.

---

많은 시간 선택기를 시도했지만 만족스럽지 않아 [아직] 다른 시간을 썼습니다. 잘 작동한다고 생각합니다. 또한 datepicker에서 영감을 얻어 표준 jQuery UI처럼 보입니다.

기본 분 단위는 5이며 옵션에서 15로 설정할 수 있습니다.

http://fgelinas.com/code/timepicker

---

내 조언은 이렇게하지 말라는 것입니다. 나는 날짜를 입력하기 위해 달력 컨트롤을 사용하는 것이 충분히 나쁘다는 것을 알았다. 특히 또 다른 이상한 컨트롤을 탐색하는 것보다 더 빨리 할 수있는 날짜를 입력 할 수있는 옵션이 주어지지 않았을 때.

시간 선택자는 이러한 종류의 UI 페티쉬를 새로운 극한으로 가져갑니다. 사용자가 시간을 입력하거나 몇 시간 및 분 동안 몇 개의 드롭 다운 상자를 사용하도록 허용하지 않는 이유는 무엇입니까? 드롭 다운 목록도 사용자가 시간을 입력 할 수 있도록합니다. Shog9의 답변 에있는 시간 선택기 는 모두보기에는 좋지만 사용하기에는 매우 까다 롭습니다. 내가 데이터 입력 앱을 사용해야하는 최종 사용자 였고 페이지에 이와 같은 컨트롤이 있으면 속도가 느려지고 개발자의 손을 끊고 싶게 만들 것입니다. :)

앱이 얼마나 매끄럽게 보이는지 먼저 사용성에 대해 생각하십시오.

내 겸손한 의견입니다.

---

jQuery는 아니지만 ... 15 분 간격, 오전 8시, 오전 8시 15 분, 오전 8시 30 분 등의 목록이있는 드롭 다운이 사용자가 상호 작용하기 매우 쉽다는 것을 발견했습니다.

이 작업을 수행하는 jQuery 방법 이 정말로 필요한지 확실하지 않은 것은 과도 할 수 있습니다. 실제 사용자 및 비즈니스 응용 프로그램 개발 에 대한 개인적인 경험을 기반으로 한 의견 입니다.

---

좋은 시간 파서를 사용하고 사용자가 광범위한 유효한 시간 문자열 (오전 8시, 오전 8시, 8a, 8 등)을 입력 할 수 있도록하려면 http : //www.datejs를 살펴보십시오 . .com / .

다음은 작업에 사용하는 jquery 코드입니다.

$('.time').blur(function (e) {
    var val = $(this).val();
    if (!isNaN(val))
        // add minutes to numeric value otherwise it will be interpreted as a date
        val = val + ':00'; 
    var dt = Date.parse(val);
    $(this).val(dt.toString('h:mm tt'))
});

---

Kev를 제외한 모든 답변은 주관적이라고 생각합니다. 나는 인터넷에서 10 분의 1의 시간 선택기 JQuery 플러그인을 보았고 대부분은 쓸데없는 시간 소모적 기믹 이었지만 이미 표준 Jquery datepicker를 사용하고 있다면 이 플러그인이 적절할 것입니다.

---

Maxime Haineault의 jQuery.timepicker를 확인하십시오 . 꽤 멋지다, IMHO ...

---

내가 사용한 최고의 것은 Telerik에서 제공하는 것입니다.

http://demos.telerik.com/aspnet-ajax/calendar/examples/datetimepicker/overview/defaultcs.aspx

눈에 잘 띄지 않아 사용자가 시간을 입력하거나 시계 아이콘을 클릭하여 목록에서 선택할 수 있습니다. 기본적으로 편집 가능한 드롭 다운을 사용하는보다 미학적으로 매력적인 방법입니다.

---

이 훌륭한 lib를 사용해보십시오-http: //code.google.com/p/mobiscroll/

데모-http: //demo.mobiscroll.com/

---

주제에 대한 나의 시도는 다음과 같습니다. http://yoka.github.com/jquery-timeselect/

---

저는 Trent Richardson의 timepicker 라이브러리를 사용해 왔으며 그것이 훌륭하다는 것을 알게되었습니다. 다운로드 횟수에 따라 매우 인기가 있습니다.

---

Jim이 언급 한 플러그인 (Google 캘린더 시간 선택기처럼 작동)을 기반으로 작성 했지만 jquery ui 자동 완성을 사용하여 작동합니다. 앞서 언급 한 플러그인보다 훨씬 더 안정적입니다. 나는 페이지에 그 자체를 배치하는 데 문제가 있습니다. 플러그인은 배열, 시간 범위 및 간격 또는 ajax 소스를 사용하므로 마음에 드는 콘텐츠에 맞게 사용자 정의 할 수 있습니다.

---

표준은 없지만 Keith Wood 의 jQuery 플러그인을 사용하고 있습니다. 일부와 달리 이것은 텍스트 상자 (검증을 수행하는 동안 입력 할 수 있음)로 저하되며, 원하는 경우 마우스와 함께 사용할 수도 있습니다.

---

내 상황은 약간 달랐고 날짜 시간 선택기가 필요했지만 하나도 찾을 수 없었습니다. 그래서 하나를 쓰기로 결정했습니다. 여기 에서 전체 소스를 찾을 수 있습니다 . 또한 빠른 데모를 게시 했습니다 .

---

내가 원하는 것을 수행 한 플러그인 (즉, 시간 동안 입력 마스킹과 결합 된 다중 열 자동 완성)을 찾을 수 없어서 MenuOptions를 작성 했습니다.

어떻게 생겼는지

---

은 모든 + 시간 ™ DatePicker에서 / TimePicker AJAX 달력 위젯은 마우스를 사용하는 경우, 약으로 빠른 손으로 타이핑이 아니라, 오류 방지의 추가 혜택을 가지고, 시간을 선택할 수 있습니다. 시간은 필요한 방식으로 형식을 지정할 수 있습니다. 키보드 조작도 지원하지만 키보드 액세스가 마우스 나 입력만큼 빠르지는 않지만 ... 다시 말하지만 값이 필요한 형식이 될 것임을 보장합니다. 또한 사용자 지정하기 쉽고 날짜도 처리 할 수 ​​있습니다.

참고 URL : https://stackoverflow.com/questions/476822/jquery-time-picker