So, I have a combo box made in HTMl.
https://i.stack.imgur.com/5W6kt.png
HTML Code:
<div>
<select name="cars" id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
</div>
Now, what I need to do is, assign an ID to the <div> tag and define an event to the combo box that will call a function in JS code. This function needs to check the selected value of the <div> (combo box) and write it out in inner HTML, like this:
https://i.stack.imgur.com/Fxbv0.png
I know this is probably an easy job but I'm a beginner, don't go hard on me :D.
Edit: SOLVED!
HTML:
<!doctype html>
<html>
<head>
<script type="text/javascript" src="script.js"></script>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<select id="box1" onChange="function1(this);">
<option value="">Volvo</option>
<option value="">Fiat</option>
<option value="">Seat</option>
<option value="">Audi</option>
</select>
<div id="div1"></div>
</body>
</html>
JS:
function function1(element) {
var text = element.options[element.selectedIndex].text;
document.getElementById("div1").innerHTML = "Selection is: " + text;
}
Every Element in HTML has an id is a variable in JS
cars.onchange = function(e){
car.innerText = cars[cars.selectedIndex].value;
}<select name="cars" id="cars">
<option value="">Select a Car</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select> selection is: <span id='car'></span>