1

I want when the user changes the value of time input, the result displayed in my div. how?

let input = document.getElementById('time');
let result = document.getElementById('result-1');
input.onchange = handleChange;

function handleChange(e){
result.innerHTML = e.target.value;
}
<form action="/action_page.php">
  <label>Time:</label>
  <input type="time" id="time" name="time" value="">
</form>
<br>
<div id="result-1">Result</div>
Arman Ebrahimi
  • 2,035
  • 2
  • 7
  • 20
  • Would this help? https://codesandbox.io/s/lucid-sound-tz5e2?file=/src/index.js I did change your selectors into querySelector. First one is using "#" and second one is using "." as prefix. But I've also added logic so it should work as intended. Hope it helps... – Veljko Blagojevic Jan 26 '22 at 14:00
  • @VeljkoBlagojevic very thanks but result not places in the `.result`. – Arman Ebrahimi Jan 26 '22 at 14:11
  • I've reopened the question because you've fixed the query selector issue. The code seems to be working: a valid time has to be entered, and then the inner HTML updates as expected. What is the issue you're facing here? – Terry Jan 31 '22 at 09:49
  • @Terry very thanks. The problem is that time is not shown in `div`(when the input changes). – Arman Ebrahimi Jan 31 '22 at 09:55
  • It does show: but you need to enter both the hour and the minutes first. A simple workaround is to provide the current time as the default value. – Terry Jan 31 '22 at 10:01
  • @Terry yes it works in this state, but what is its reason? why does this not work when `value` is empty? – Arman Ebrahimi Jan 31 '22 at 10:09
  • @ArmanEbrahimi It does work when the value is empty. The value is being written to the `
    `. You don’t see anything because it’s _empty_. An ``’s `value` is only non-empty if it contains a valid time, as [documented](//developer.mozilla.org/docs/Web/HTML/Element/input/time) and [specified](//html.spec.whatwg.org/multipage/input.html#time-state-%28type=time%29).
     – Sebastian Simon Jan 31 '22 at 10:53
  • @SebastianSimon Right. but I do not want something written in the `div` before any change, but I expect even if the value is empty in first, a new value showed in the `div` when I changes input time. – Arman Ebrahimi Jan 31 '22 at 17:15

0 Answers0