Rimuovi secondi in Chrome input = tempo

Nell'ultimo aggiornamento di Chrome ("23.0.1271.64 m" nel mio caso), sembra che input = time ora includa secondi che sono inattivi e non cliccabili. Questo non è bello nel nostro sito, quindi voglio sapere se qualcuno ha trovato un modo per rimuovere secondi. Sfortunatamente jsfiddle non funziona e non posso pubblicare un esempio, ma lo pubblico qui in modo che la gente possa leggerlo comunque.Rimuovi secondi in Chrome input = tempo

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

Dal secondi è solo "disteso" e non sono modificabili, è possibile che questo problema si verifica e sarà risolto presto.

fonte

2012-11-08 Solander

Chrome 23 stabile su OSX e Linux omette i campi secondi se non è necessario e anche Chrome 24 beta su Windows lo omette. Ti consiglio di attendere la versione stabile di Chrome 24.

fonte

2012-11-09 06:20:45

E per quanto riguarda Android? –

Avendo lo stesso problema. Ho usato una larghezza fissa con white-space: nowrap e overflow: hidden per nascondere i secondi, ma quando l'input è focalizzato il problema rimane.

fonte

2012-11-08 13:45:58 Remon

non ho potuto trovare alcuna modifica/note di rilascio per 23.0.1271.64 m che si riferisce a qualsiasi cambiamento delle forminput tipi, ma secondo l'ultima bozza di lavoro del HTML5 markup documentation dal W3C l'elemento input type="time" non supporta qualsiasi altro formato tempo che "un tempo parziale valido come definito in RFC 3339 ", ovvero hh:mm:ss.ff e hh:mm:ss.

Poiché non ci sono attributi per specificare il proprio formato data/ora su nessuno dei due data/ora inputelements si è bloccato con il formato definito (s).

Da input type=time – time input control

Valore: A parziale tempo valido come definito nella [RFC 3339].
Esempi:
23: 20: 50,52
17:39:57

partire RFC 3339

tempo secfrac = "". 1 * DIGIT
parziale in tempo = tempo di ore ":" Tempo minuti ":" tempo di secondi [time-secfrac]

Infine, includo uno screenshot di come Chrome 23.0.1271.64 m rende i diversi formati di tempo (sulla mia macchina);

<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="" />

enter image description here

Il markup è disponibile a jsFiddle anche.

fonte

2012-11-08 20:27:05 Stefan

Sembra che ci sia un bug in Chrome che impedisce l'invio dei campi del tempo se hanno secondi (si veda [qui] (http://jsfiddle.net/ZGTUr/12/)). – Behrang

Android Chrome e browser web hanno ancora quel problema, così ho fatto una specifica per smartphone al lavoro intorno usando angularjs:

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

Come funziona:

ci sono 2 elementi che gestiscono questo :

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

nel codice di collegamento, lo stile degli elementi (può farlo nel file CSS pure), e si legano al click anche di campata:

 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(); 
     });

Poi, registrare un ascoltatore variazione per il valore temporale e aggiornare la variabile 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"); 
     });

Così, quando l'utente tocca campata, l'ingresso sia viene concentrata o cliccato (iOS e ANDROID fanno la differenza), facendo in modo che l'interfaccia utente del time-maker nativo venga visualizzata.

fonte

2014-03-06 14:35:36 narrowtux

So che questa è una domanda molto vecchia, ma ho appena trovato la soluzione.

È necessario modificare il passo a 60. Se si lascia il passo predefinito (1), esso dovrà aumentare di un secondo, quindi deve mostrare i secondi sul campo.

Se si imposta il passo su 60, aumenterà di 1 minuto alla volta, quindi non è necessario mostrare i secondi.

fonte

2015-03-09 12:02:06 hend

non sembra funzionare su Android 4.4/Chrome 30 webview/US locale –

Sembra che questo sia [un bug in Android Chrome] (http://stackoverflow.com/a/28664821/245966) risolto in Chrome 43 –

La soluzione di hend di impostare step su 60 funziona su un input vuoto, ma se si carica il modulo con i valori prepopolati, si scoprirà che i secondi potrebbero riapparire in uno stato disabilitato.

È possibile mascherare loro e il colon penzoloni con il seguente CSS:

::-webkit-datetime-edit-second-field { 
    background: $color-white; 
    color: transparent; 
    margin-left: -3px; 
    position: absolute; 
    width: 1px; 
    }

da cui si ricava la seguente:

fonte

2017-02-08 18:12:22 brogrammer

stiamo usando moment.js per risolvere questo. È possibile arrotondare i secondi per evitare le Milis in un tempo di ingresso precompilato impostando il regolatore con:

const localDate = moment(data.date).startOf('minute').toDate();

Spero che aiuta;)

fonte

2017-05-16 13:51:05 Pelirrojo

Ho avuto lo stesso problema, se si utilizza un pre data popolato per riempire il vostro ingresso, basta usare questo:

var myDate = new Date(); 
myDate.setSeconds(0); 
myDate.setMilliseconds(0);

Con il tag input in questo modo:

<input type="datetime-local" step="60"/>

Personalmente uso angolare ma tutto dovrebbe funzionare poiché Date è Javascript.

fonte

2017-08-14 10:26:58 sebius

Rimuovi secondi in Chrome input = tempo

risposta

Problemi correlati