Qual é a maneira mais eficiente de preencher um horário (ou intervalo de tempo)?

StackOverflow https://stackoverflow.com/questions/25455

  •  09-06-2019
  •  | 
  •  

Pergunta

Embora existam muitas soluções para inserir datas (como calendários, menus suspensos, etc.), não parece que existam muitas maneiras "padrão" de solicitar um horário (ou intervalo de tempo).

Eu pessoalmente tentei menus suspensos para os campos de hora, minuto e segundo (e às vezes também um campo "AM/PM").Também experimentei vários dispositivos de entrada semelhantes a relógio, muitos dos quais são muito difíceis de usar para o usuário final típico.Eu até tentei menus de seleção de tempo "pop-out" (que permitem, por exemplo, passar o mouse sobre a hora "10" para receber um submenu que contém ":00",":15",":30 ", e ":45") - mas nenhum desses métodos parece natural.

Até agora, o melhor (e mais universal) método que encontrei é apenas usar campos de texto simples e forçar o usuário a preencher manualmente a hora, o minuto e o segundo.Como alternativa, tive boas experiências criando algo semelhante à "Visualização diária" do Outlook, que permite arrastar e soltar um evento para definir os horários de início e término.

Existe uma "melhor maneira" de solicitar essas informações?Alguém está usando algum tipo de widget de entrada de tempo que seja realmente intuitivo e fácil de usar?Ou existe pelo menos uma maneira mais eficiente do que usar caixas de texto simples?­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­

Foi útil?

Solução

Considero a abordagem do Google Agenda a melhor.Use uma caixa de texto, mas use JavaScript para torná-la uma espécie de menu suspenso para escolher seu horário.Uma boa demonstração pode ser encontrada para um jQuery implementação aqui

Ainda não implementei isso em meu site, então não tenho 100% de certeza, mas acho que você também precisa do código deste plugin jQuery aqui:
http://www.texotela.co.uk/code/jquery/timepicker/

Editar
O primeiro link que postei não requer o código do segundo link.É simplesmente baseado nisso.Para obter o arquivo JavaScript real do exemplo, você pode visualizar o código-fonte da página para descobrir onde o arquivo está ou pode acessar o URL diretamente
http://labs.perifer.se/timedatepicker/jquery.timePicker.js

Outras dicas

Existe um recurso bastante útil entrada de tempo ferramenta para JQuery.Ele fornece uma abordagem do tipo 'spinner', além de um campo de texto padrão.Ele também suporta o uso da roda de rolagem do mouse para ajuste (bem como a abordagem tradicional de 'basta digitar') e pode ser configurado para restringir a npassos de minutos também, se quiser.É bastante personalizável, suporta localização e uma variedade de outras configurações. Usei-o com sucesso em alguns projetos/sites de demonstração.

Sou um grande fã de linguagem simples (houve um tópico sobre isso outro dia).Gosto da maneira como o calendário da mochila 37signals permite que você digite as coisas (12/08, 15h, Reunião com Tom).Também gosto da maneira como eles lidam com os horários com seu sistema de lembretes (eles oferecem opções como hoje mais tarde, amanhã de manhã).

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top