JavaScript получить значение onchange

Question

Я пытаюсь получить выбранное входное значение для отображения в div onchange, но, похоже, оно не работает, и мне просто интересно, может ли кто-нибудь помочь или знает, почему?

function getData(dropdown) {
  var values = dropdown.options[dropdown.selectedIndex].value;
  var pop = Game.currentGame.ui.options.servers.values.population;
  var servers = document.getElementsByClassName('hud-intro-guide')[0];
  servers.textContent = "Server " + pop + " population"
}

<select class="hud-intro-server" onchange="getData(this);">
  <optgroup label="asia servers">
    <option value="v8617903">asia #1 </option>
    <option value="v8617895">asia #2 </option>
    <option value="v8617899">asia #3 </option>
    <option value="v8617900">asia #4 </option>
    <option value="v8617898">asia #5 </option>
    <option value="v8617894">asia #6 </option>
    <option value="v8617901">asia #7 </option>
    <option value="v8617902">asia #8 </option>
    <option value="v8617897">asia #9 </option>
  </optgroup>
</select>

<div class="hud-intro-guide"> </div>

Answer 1

var pop = Game.currentGame.ui.options.servers.values.population;

должно быть

var pop = Game.currentGame.ui.options.servers[values].population;

Answer 2

Вероятно, ваша проблема в том, как вы пытаетесь использовать переменную values.

  var pop = Game.currentGame.ui.options.servers.values.population;
                                                ^
                                                |
                                                +-- Here you're accessing the attribute values 
                                                    rather than getting the server related 
                                                    to the chosen option.

Что вам действительно нужно, так это:

function getData(dropdown) {
  var values = dropdown.options[dropdown.selectedIndex].value;
  var pop = Game.currentGame.ui.options.servers[values].population; 
                                                ^
                                                |
                                                +-- With this, you're getting the server.

  var servers = document.getElementsByClassName('hud-intro-guide')[0];
  servers.textContent = "Server " + pop + " population"
}

Answer 3

Вам не нужно добавлять событие изменения в тег выбора.Просто добавьте событие изменения в функцию выбора в функции jquery в document.ready, напишите событие, как показано ниже:

$('#your select id').on('change', function() {  alert( this.value );});

ИЛИ

 $('.your select class').on('change', function() {  alert( this.value );});