Необходим код выбора времени в AM PM

#javascript #jquery #datepicker

#javascript #jquery #выбор даты

Вопрос:

Я не хочу использовать выпадающий список HTML для выбора времени AM PM в формате 12 часов … кто-нибудь может дать мне ссылку на это.Я хочу средство выбора AM PM на основе Jquery / Javascript / CSS

1. Почему вы не хотите использовать выпадающий список? Кроме того, AM против PM также может быть переключателем. Я бы настоятельно рекомендовал начать с переменных собственной формы, а затем модифицировать их, чтобы сделать вашу страницу максимально доступной.

Ответ №1:

Вот решение, которое делает то, что вы хотите, хотя tbthorpe прав, было бы неплохо превратить два диапазона, которые я использую, в переключатели, и оформить их так, чтобы они работали так же, как мое решение.

http://jsfiddle.net/csaltyj/PPQQ8/

Что вы могли бы сделать, так это установить переключатели с классом на них и использовать jQuery, чтобы скрыть их и заменить их интерактивными промежутками, которые фактически запускают нажатия переключателей. Вероятно, лучшее решение для обеспечения доступности.

1. На самом деле мне нужен инструмент выбора даты, который содержит шаблон часов с AM PM……. Ваш пример хорош, но он будет весьма заметен, если вы будете указывать часы и минуты

Ответ №2:

Вот более надежный инструмент выбора времени, чем просто AM / PM — это плагин jQuery. Предположительно, вы могли бы сократить js / css и просто позволить вам выбирать am или pm.

http://fgelinas.com/code/timepicker/

Ответ №3:

Я нашел это, пытаясь найти приличный инструмент выбора времени, который поддерживает американский стиль AM / PM и не использует выпадающий список. Лучшим инструментом для меня было anytime. http://www.ama3.com/anytime /

пример кода (при условии, что вы загрузили jQuery и скрипт AnyTime)

 $("#field2").AnyTime_picker( {
    format: "%h:%i %p",
    labelTitle: "Time",
    labelHour: "Hour",
    labelMinute: "Minute"
} );

поддержка html

 <input type="text" id="field2" value="" readonly="">

Пример скрипта:

http://jsfiddle.net/brianlmerritt/Lzn7fnnw/2/

И это выглядит примерно так…