如何从Javascript中的下拉列表中获取选定的值

Question

现在，在你告诉我这是一个问得过多的问题之前，我已经尝试查看这个问题的多个版本，当我尝试他们的解决方案时，它们都不适合我。所以我打算直接寻求帮助。

无论如何，我有一个下拉列表，其中包含美国各州对应的能源成本。我试图做到这一点，以便当用户选择一个状态时，Javascript 代码会检测到更改，找到所选选项的值，并根据该选择设置一个变量（在 switch 语句中声明）。

但是，问题是，无论我做什么，它都不起作用。我不知道我是否拼错了什么，或者我需要写一些我不知道的东西，但无论我做错了什么，它都不起作用。

这是 HTML：

<div class="question">
      <p><b>In which U.S. state are you currently living in?</b></p>
      <select id="stateselect">
        <option value="choose" selected="selected">[none]</option>
        <option value="al">Alabama</option>
        <option value="ak">Alaska</option>
        <option value="az">Arizona</option>
        <option value="ar">Arkansas</option>
        /* Removed most of the options for sake of space*/
      </select>
    </div>

还有 Javascript：

var energyCost;
var state = document.GetElementById('stateselect');
function getEnergyCost() {
  switch (state.value) {
    case 'choose':
      energyCost = 0.00;
      break;
    case 'al':
      energyCost = 0.13;
      break;
    case 'ak':
      energyCost = 0.21;
      break;
    case 'az':
      energyCost = 0.12;
      break;
    case 'ar':
      energyCost = 0.10;
      break;
   /* Ditto */
  }
}
state.addEventListener('change', getEnergyCost, false);

有人介意在这方面给我一些帮助吗？谢谢！

注意：我需要纯 Javascript 的答案，而不是 jQuery。

Answer 1

你有一个简单的错字。这是getElementById，而不是GetElementById。

Answer 2

你需要改变

var state = document.GetElementById('stateselect');

到

var state = document.getElementById('stateselect');

getElementById 中 get 的大写使其成为无效函数。