google chrome - rapido - Eliminar segundos en la entrada de Chrome=tiempo
desactivar notificaciones chrome android (8)
Android Chrome y Webbrowser todavía tienen ese problema, así que hice una solución específica para smartphone usando angularjs:
Cómo funciona:
Hay 2 elementos que manejan esto:
<span>{{ timeDisplay }}</span>
<input type="time" ng-model="time">
En el código de enlace, aplique estilo a los elementos (también puede hacerlo en un archivo CSS) y vincule al clic incluso del tramo:
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();
});
Luego, registre un detector de cambios para el valor de tiempo y actualice la variable timeDisplay:
$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");
});
Entonces, cuando el usuario toca el tramo, la entrada se enfoca o se hace clic (iOS y ANDROID hacen una diferencia allí), lo que hace que aparezca la interfaz de usuario nativa del selector de tiempo.
En la última actualización de Chrome ("23.0.1271.64 m" en mi caso), parece que input = time ahora incluye segundos que están inactivos y no se puede hacer clic. Esto no se ve bien en nuestro sitio, así que quiero saber si alguien ha encontrado una forma de eliminar los segundos. Lamentablemente, jsfiddle está inactivo y no puedo publicar un ejemplo allí, pero lo publico aquí para que la gente pueda leerlo de todos modos.
<html>
<head></head>
<body>
<input type="time" value="00:44" name="tiiiiden"/>
</body>
</html>
Como los segundos solo están "ahí acostados" y no son editables, es posible que se trate de un error y se solucionen muy pronto.
No pude encontrar ninguna nota de cambio / versión para 23.0.1271.64 m que se relaciona con cualquier cambio de los tipos de input form pero según el último borrador de trabajo de la documentación de marcado HTML5 del W3C, el elemento input type="time" no admite ninguna otro formato de tiempo que " un tiempo parcial válido como se define en RFC 3339 ", y que es hh:mm:ss.ff y hh:mm:ss .
Como no hay ningún atributo para especificar su propio formato de fecha / hora en ninguno de los elementos de input fecha / hora, está atascado con el (los) formato (s) definido (s).
Desde el tipo de entrada = control de entrada de tiempo - tiempo
Valor : un tiempo parcial válido como se define en [RFC 3339] .
Ejemplos:
23: 20: 50.52
17:39:57
De RFC 3339
time-secfrac = "." 1 DÍGITO
tiempo parcial = hora-hora ":" tiempo-minuto ":" tiempo-segundo [tiempo-secfrac]
Finalmente, Chrome 23.0.1271.64 m una captura de pantalla de cómo Chrome 23.0.1271.64 m representa los diferentes formatos de tiempo (en mi máquina);
<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="" />
El marcado también está disponible en jsFiddle .
Teniendo el mismo problema Usé un ancho fijo con white-space: nowrap y overflow: hidden para ocultar los segundos, pero cuando la entrada está enfocada, el problema persiste.
Chrome 23 estable en OSX y Linux omite los campos de segundos si no es necesario, y Chrome 24 beta en Windows también lo omite. Te recomiendo que esperes la versión estable de Chrome 24.
Sé que esta es una pregunta muy antigua, pero acabo de encontrar la solución.
Debe cambiar su paso a 60. Si deja el paso predeterminado (1), tendrá que aumentar un segundo, por lo que debe mostrar los segundos en el campo.
Si establece su paso en 60, aumentará 1 minuto a la vez, por lo que no necesita mostrar los segundos.
La solución de ajuste de @ hend de 60 step funciona en una entrada vacía, pero si carga su formulario con valores previamente rellenos, encontrará que los segundos pueden reaparecer en un estado deshabilitado.
Puede enmascararlos y los dos puntos colgantes con el siguiente CSS:
::-webkit-datetime-edit-second-field {
background: $color-white;
color: transparent;
margin-left: -3px;
position: absolute;
width: 1px;
}
Que produce lo siguiente:
Estamos usando moment.js para arreglar esto. Puede redondear los segundos para evitar los milis en un tiempo de entrada preopuesto configurando en el controlador con:
const localDate = moment(data.date).startOf(''minute'').toDate();
Espero que ayude ;)
Tuve el mismo problema, si está utilizando una fecha prepoblada para completar su entrada, solo use esto:
var myDate = new Date();
myDate.setSeconds(0);
myDate.setMilliseconds(0);
Con la etiqueta de entrada como esta:
<input type="datetime-local" step="60"/>
Personalmente uso angular, pero cualquier cosa debería funcionar, ya que Date es Javascript.