Input time zwraca niepełną godzinę

Question

Cześć,

mam pytanie dlaczego input typu "time" z step ustawionym na 1. Zwraca mimo wszystko godzinę w formacie 00:00 gdy wpiszemy ręcznie w sekundach zera.

Co zrobić aby nawet przy wpisaniu np. 20:00:00 wyświetliło pełen format 20:00:00 a nie 20:00?

Answer 1

https://stackoverflow.com/questions/14487621/how-do-i-force-seconds-to-appear-on-an-html5-time-input-control/14487701

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time

Comments

@niezalogowany, problem w tym że używam step=1 tak jak napisałem i i tak zwraca format 00:00 gdy sekundami są zera. Jest wyjątek jeśli nie wpisuje ręcznie godziny a zaznaczam czas na tym kółku w input. Wtedy gdy zaznaczę sekundy na 0 to zwraca format 00:00:00. Ale i tak chciałbym się dowiedzieć jak to zmienić, ponieważ user zazwyczaj będzie chciał ową godzinę wpisywać.

---

pokaż swój kod

---

@niezalogowany, 

<input className="input-time" onInput={e => setTimePreparation(e.target.value)} type='time' step="1"></input>

 

---

<input id="appt-time" type="time" name="appt-time" step="1" onInput="myFunc()">

<p id="demo"></p>

function myFunc() {
const x = document.getElementById("appt-time").value;
  document.getElementById("demo").innerHTML = x;
}

 

---

To niczego nie zmienia, odpal sobie w codepen ten kod. Wpisz np. 10:00:00, i tak zwraca tylko 10:00 bez sekund.

---

odpaliłem i działa

używam firefoxa.

 

---

Wpisałeś z palca tą godzinę czy ustawiłeś poprzez ten zegarek na inpucie klikiem?

---

Rozwiązaniem jest też zmienienie inputa na typ text i wymuszenie paternu poprzez required pattern="\d\d:\d\d:\d\d. Ale dziwne, że mi dla tego inputu nie zwraca sekund.

---

przetestuj w Firefoxie i sprawdź sam

---

w chromie działa po ustawieniu klikiem na zegareczku w inpucie a firefoxie z palca jak to ująłeś ...

---

no u mnie na operze tylko przy ustawieniu klikiem działa, zmienię na text tak jak wyżej pisałem. Może się kiedyś dowiem dlaczego tak jest :D

---

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time 

poczytaj pod tym akapitem

Using the step attribute

---

na firefoxie działa, na chrome , edge i operze nie działa :D

---

wyjaśniło się

BTW myślę że powinieneś sobie zainstalować dwie najpoważniejsze opcje,chociażby do testów