How to pass option into HTML select

Question

I want different behaviors depending on which <option> element is selected:

<select name="colorSelector" onchange="handleColorChange();">
    <option value="">- select -</option>
    <option value="1">Red</option>
    <option value="2">Blue</option>
</select>

function handleColorChange() {
    // Behave different depending on which <option> was just selected
}

What do I need to pass into the handleColorChange() method from inside the onchange listener in order to accomplish this?

Answer 1

Looks like noone has mentioned switch yet. Also, don't put the function in the HTML, that's just bad. Here is the right way:

document.getElementsByName( 'colorSelector' )[ 0 ].onchange = function ( ) {
    switch ( this.options[ this.selectedIndex ].value ) {
        case '1':
            // Do something when "Red" is selected
            break
        case '2':
            // Do something when "Blue" is selected
            break
    }
}