Javascript Time Picker comme Windows

Question

Je suis à la recherche d'un exemple d'un Time Picker Javascript qui est similaire à celui utilisé dans Windows pour choisir le temps ... bien sauf avec les secondes étant dans leur. J'ai une maquette en place en ce moment, mais j'essaie de comprendre comment certaines fonctionnalités de l'utilisateur devraient être telles que deux entrées et une liste déroulante. Je suppose que je ne suis pas content avec ça pour le moment. Merci d'avance pour toute aide

Answer 1

Le sélecteur d'heure de Windows (si vous faites référence à celui pour changer l'horloge du système) est essentiellement une zone de texte d'édition masquée. Si vous cherchez quelque chose de similaire, vous avez juste besoin d'un peu de JavaScript pour faire des modifications masqués, comme celui-ci:

http://digitalbush.com/projects/masked-input-plugin/

Pour faire spécifiquement pour le temps, vous devriez être en mesure d'ajouter facilement la logique pour assurer la les heures ne dépassent pas 12 (ou 24), et les minutes ne dépassent pas 59.

Personnellement, je préfère la façon dont Google Agenda effectue les sélections de temps. Il existe un plugin jQuery pour ce qui se trouve ici:

http://labs.perifer.se/timedatepicker/

Answer 2

En voici une bonne idée.

http://www.java2s.com/Code/JavaScript/GUI-Components/FancyTimePicker.htm

Un exemple en ligne de la commande est affiché here.

Answer 3

Il existe un certain nombre de plugins jQuery que vous pouvez utiliser pour un contrôle parfait du sélecteur de temps.

Voici une bonne: http://plugins.jquery.com/project/timepicker

Answer 4

Je suis assez friand des choses jQuery, Il y a une assez belle un here.

Answer 5

Comme Dan dit, si vous êtes à la recherche d'une entrée de texte masqué et si vous souhaitez utiliser le cadre PrototypsJS, il y a http://code.google.com/p/phenx-web/. Et si vous voulez un bon sélecteur date/heure, vous pouvez utiliser ceci: http://home.jongsma.org/software/js/datepicker (aussi PrototypeJS). Je travaille actuellement dessus avec Jerermy Jongsma pour ajouter plus de fonctionnalités.

Answer 6

J'ai fini par créer un prototype de sélecteur de temps qui, pour le moment, est moins sophistiqué que beaucoup d'autres. Il affiche une entrée régulière jusqu'à ce que vous cliquiez dessus, puis il affiche une liste déroulante qui contient des heures. Je peux partager le code si quelqu'un est intéressé

Answer 7

Un timepicker ne devrait pas ralentir l'interaction de l'utilisateur, devrait être assez simple sans avoir à jouer avec lui pendant un certain temps, et devrait être accessible au clavier pour les utilisateurs qui peuvent ' t manipuler une souris. La fonctionnalité de saisie temporelle fournie par le Any+Time™ Datepicker/Timepicker AJAX Calendar Widget with TimeZone Support répond à tous ces objectifs de conception, prend en charge d'innombrables formats de date/heure et est facile à personnaliser à l'aide de CSS ou de l'interface utilisateur jQuery. Un bon test de la facilité d'utilisation timepicker est de penser à un temps impair (disons, 22h32), puis de voir combien de temps il faut pour sélectionner avec précision cette heure en utilisant différents sélecteurs de temps. Vous pouvez probablement le faire avec Any + Time ™ plus rapidement que vous ne pouvez même écrire le temps à la main ... comment ça marche pour la rapidité et la facilité d'utilisation? :-p