I have a dropdown list which looks like this:
<select id="cityID"> <option value="mission">Mission</option> <option value="bakersfield">Bakersfield</option> <option value="knoxville">Knoxville</option> </select>
And my code to get the value is:
var select = document.getElementById('cityID'); var text = select.options[select.selectedIndex].text; text.innerHTML = cityID.value; text.onchange = function(e) { text.innerHTML = e.target.value; }
The value always chooses the first item. How can I get it to accept the cityID and change the page,
I’m sure its a formatting or typo or wrong value ?
Advertisement
Answer
You could achieve this using addEventListener also.
var select = document.getElementById('cityID'); var textEl = document.getElementById("text") select.addEventListener("change", (e) => { textEl.innerText = e.target.value; })