BananaMaster

11 - The onchange event in select option (JavaScript) | JS lessons

If you forgot something — click to go to the lesson.

Task 1.

Create a select element with options (One, Two). When the value changes (onchange), display the selected value inside a div.

Task 2.

Create a button and a select with options "red" and "green" (the option text must match the values). When a color is selected, update the button’s background color accordingly.

Task 3.

Create a button and a select with options "100px" and "200px" (the option text must match the values). When a size is selected, update the button’s width accordingly.

Task 4.

Create an input with type="date", a button, and a div. When the button is clicked, display the selected date inside the div.

Input i-4

Task 5.

Create a button and three select elements:

• First: options "100px" and "200px" for width • Second: options "50px" and "100px" for height • Third: options "red" and "green" for background color

The option text must match the values. When any select value changes, update the button’s size and background color accordingly. The changes should apply in real time (onchange).

width height background