如何使用javascript获取下拉菜单列表中某项的值？

Question

Basically, I am making a simple tax calculator and I need to get the value of an element within a drop down menu (the specific state) and then based on that, add that state's income tax rate to a variable to be used for future calculation.

Here's my HTML code:

<fieldset id="taxinfo">
    <label for="state">State of residence</label>
    <select id="state" name="state"> 
    </select>
</fieldset>

I have populated it with this javascript code:

var stateList = ["AL", "AK", "AZ", "AR", "CA", "CO", "CT", "DE", "FL", "GA", "HI", "ID", "IL", "IN", "IA", "KS", "KY", "LA", "ME", "MD", "MA", "MI", "MN", "MS", "MO", "MT", "NE", "NV",
               "NH", "NJ", "NM", "NY", "NC", "ND", "OH", "OK", "OR", "PA", "RI", "SC", "SD", "TN", "TX", "UT", "VT", "VA", "WA", "WV", "WI", "WY"];
// array to add months to drop-down list menu
function addStates() {
var select = document.getElementById("state");
for (var i = 0; i < stateList.length; i++) {
    var list = stateList[i];
    var el = document.createElement("option");
    el.innerHTML = list;
    el.value = list;
    select.appendChild(el);
  }
}

For example, if someone chose "TX" from the drop down menu list, I would want to set a variable named stateTax to 0;

Edit: couldn't get Gregg's answer to work for me. Tried to use it in an if/else decision structure as such --- doesn't seem to be working:

// function to acquire tax rate based on state selected from menu list
function getStateTax() {
    var stateTax;
    var sel = document.getElementById("state");
    var st = sel.options[sel.selectedIndex].text;

    // if/else decision structure to set appropriate tax based on state
    if (st == "TX") {
        stateTax = 0;
    }
}

Answer 1

The plain javascript way:

var sel = document.getElementById("state");
var state = sel.options[sel.selectedIndex].value;

the jquery way

var state = $('#state').val();

Edit function for state tax:

I would convert your state list to a javascript object to hold the tax rates for each state like this:

var taxRate = { 'AL': .07, 'AK': .05, 'AZ': .07 }

Then you can create your state list easily from the javascript object like this:

var stateList = Object.keys(taxRate);

You can use your addStates function just like it is:

function addStates() {
var select = document.getElementById("state");
for (var i = 0; i < stateList.length; i++) {
    var list = stateList[i];
    var el = document.createElement("option");
    el.innerHTML = list;
    el.value = list;
    select.appendChild(el);
  }
}

And get the Tax Rate like this:

function getStateTax(){
    var sel = document.getElementById("state");
    var state = sel.options[sel.selectedIndex].value;
    return taxRate[state];
}

See this fiddle: http://jsfiddle.net/3fqv2jwa/1/

Here's the same thing only in a jQuery version: http://jsfiddle.net/3fqv2jwa/2/