Supprimer secondes en Chrome entrée=temps

Dans la dernière mise à jour de Chrome ("23.0.1271.64 m" dans mon cas), il semble que l'entrée=temps comprend maintenant des secondes qui sont inactifs et non cliquable. Ce n'est pas agréable à regarder dans notre site, donc je veux savoir si quelqu'un a trouvé un moyen de supprimer les secondes.
Malheureusement jsfiddle est en panne et je ne peux pas poster un exemple, mais je post ici afin que les gens puissent le lire de toute façon.

<html>
<head></head>
<body>
    <input type="time" value="00:44" name="tiiiiden"/>
</body>
</html>

Depuis secondes n'est "couché" et ne sont pas modifiables, il est possible que ce soit un bug et il sera résolu très vite.

OriginalL'auteur Solander | 2012-11-08

4

Chrome 23 stable sur OSX et Linux omet les secondes champs si c'est inutile, et Chrome 24 beta sur Windows omet également. Je vous recommande d'attendre pour Chrome 24 version stable.

Ce sur Android?

OriginalL'auteur
16

Je sais que c'est une très vieille question, mais je viens de trouver la solution.

Vous devez changer votre étape à 60. Si vous laissez votre étape par défaut (1), il faudra augmenter d'une seconde, de sorte qu'il doit montrer secondes sur le terrain.

Si vous définissez votre étape à 60, il va augmenter de 1 minute à la fois, de sorte qu'il n'est pas nécessaire de montrer que les secondes.

ne semble pas fonctionner sur Android 4.4 / Chrome 30 webview / US paramètres régionaux
Il semble que ce soit un bug sur Android Chrome qui a été résolu en Chrome 43

OriginalL'auteur
4

Je ne pouvais pas trouver tout changement/notes de publication pour 23.0.1271.64 m qui a trait à toute modification de la form input types, mais selon le dernier projet de Balisage HTML5 documentation par le W3C l' input type="time" élément ne prend pas en charge tout autre format de l'heure que "valide partiel-temps tel que défini dans RFC 3339", et c'est hh:mm:ss.ff et hh:mm:ss.

Comme il n'y a pas d'attribut pour spécifier votre propre format de date/heure sur ni l'un, de la date/de l'heure input éléments vous êtes coincé avec le format défini(s).

De input type=de temps en temps de contrôle d'entrée

Valeur: valide partiel-temps tel que défini dans [RFC 3339].

Exemples:

23:20:50.52

17:39:57

De RFC 3339

temps-secfrac = "." 1*CHIFFRES

partiel-temps = " heure:" l'heure-minute ":" le temps second temps secfrac]

Enfin, je joins une capture d'écran de la façon dont Chrome 23.0.1271.64 m rend les différents formats de l'heure (sur ma machine);
```
<input type="time" value="23:20:50.52" />
<input type="time" value="17:39:57" />
<input type="time" value="13:37" />
<input type="time" value="" />
```
Le balisage est également disponible à jsFiddle.

Il semble y avoir un bug dans Chrome qui empêche les champs de l'heure d'être présentées, si elles ont en secondes (voir ici).

OriginalL'auteur
2

Avoir le même problème. J'ai utilisé une largeur fixe white-space: nowrap et overflow: hidden pour masquer les secondes, mais lorsque l'entrée est concentré le problème reste le même.

OriginalL'auteur

Android, Chrome et Webbrowser toujours avoir un problème, j'ai donc fait un smartphone spécifique de travail sur l'utilisation d'angularjs:

http://jsfiddle.net/Rvjuf/12/

Comment cela fonctionne:

Il y a 2 éléments qui le gérer:

<span>{{ timeDisplay }}</span>
<input type="time" ng-model="time">

Dans le code du lien, le style, les éléments (peut le faire dans le fichier CSS), et de le lier au clic même de l'étendue de mesure:

        scope.inputElement.css({
            position: "absolute",
            "z-index": "-10000",
            opacity: 0
        });
        scope.displayElement.css({
            width: "200px",
            height: "20px",
            background: "blue",
            color: "white",
        });
        scope.displayElement.bind("click", function(event) {
            scope.inputElement[0].focus();
            scope.inputElement[0].click();
        });

Alors, inscrivez-vous à un changement écouteur pour la valeur du temps et la mise à jour de la timeDisplay variable:

        $scope.$watch('time', function(nv, ov) {
            var parts = nv.split(" ")[0].split(":");
            var hours = parts[0];
            var minutes = parts[1];
            $scope.timeDisplay = $filter('date')(new Date(2014, 03, 06, hours, minutes, 0), "H:mm");
        });

Ainsi, lorsque l'utilisateur appuie sur la plage, l'entrée devient concentré ou cliqué (iOS et ANDROID faire une certaine différence il y a), ce qui provoque le natif de temps sélecteur de l'INTERFACE utilisateur à venir.

OriginalL'auteur

1

@hend de la solution de réglage step à 60 fonctionne sur une entrée vide, mais si vous chargez votre formulaire avec des valeurs prédéfinie, vous trouverez que les secondes peuvent réapparaître dans un état désactivé.

Vous pouvez les masquer et de le pendre du côlon avec le code CSS suivant:
```
  ::-webkit-datetime-edit-second-field {
    background: $color-white;
    color: transparent;
    margin-left: -3px;
    position: absolute;
    width: 1px;
  }
```
Qui donne ceci:

OriginalL'auteur
1

J'ai eu le même problème, si vous utilisez un pré renseigné date de remplir votre entrée, il suffit d'utiliser cette :
```
var myDate = new Date();
myDate.setSeconds(0);
myDate.setMilliseconds(0);
```
Avec la balise d'entrée comme ceci:
```
<input type="datetime-local" step="60"/>
```
Personnellement, je utiliser angulaire, mais tout devrait fonctionner depuis la Date est en Javascript.

OriginalL'auteur
0

Nous utilisons moment.js pour résoudre ce problème. Vous pouvez arrondir les secondes pour éviter les milis dans un préenregistrés de temps d'entrée par la mise sur le contrôleur avec:
```
const localDate = moment(data.date).startOf('minute').toDate();
```
J'espère que ça aide 😉

OriginalL'auteur

Vous devez vous connecter pour publier un commentaire.