从下拉列表中检索并为Java Script设置标签

Question

我想在用户选择下拉列表中的一个值时显示标签。 这些是我的编码。

<table>
    <tr>
        <td>Spend Amount </td>
        <td>
            <select name="amountSpend">
              <option value="Less">Less </option>
              <option value="More">More</option>
              <option value="By">range</option>
            </select>
        </td>
    </tr>  
</table>​

例如，当用户选择较少时，我想使用标签显示“小于10”。 感谢

Answer 1

您可以使用document.getElementsByName来检索选择并处理onchange事件：

<label id="foo"></label>

<table>
    <tr>
        <td>Spend Amount </td>
        <td>
            <select name="amountSpend">
              <option value="Less">Less </option>
              <option value="More">More</option>
              <option value="By">range</option>
            </select>
        </td>
    </tr>  
</table>​

<script>
    document.getElementsByName('amountSpend')[0].onchange = function(e){
        document.getElementById('foo').innerHTML = this.value + ' than 10';
    };
</script>

示例：

http://jsfiddle.net/XkXrv/