Присвоить значения выпадающему параметру из javascript переменных? - PullRequest
0 голосов
/ 10 апреля 2020

У меня выпадающий список с четырьмя опциями. Я хочу назначить значения для раскрывающегося списка из javascript.

                <select class="dropwdown-test" id="dropTest"> 
                    <option>Person 1</option>
                    <option>Person 2</option>
                    <option>Person 3</option>
                    <option>Person 4</option>
                  </select>

Это четыре переменные, которые необходимо присвоить option значениям из функции () или функции (ответа).

                    var p1 = 'john'
                    var p2 = 'marcus'
                    var p3 = 'anthony'
                    var p4 = 'aaron'

1 Ответ

1 голос
/ 10 апреля 2020

Вы можете сделать что-то вроде ниже:

document.addEventListener('DOMContentLoaded', (event) => {      // on DOM loaded
  var p1 = 'john';
  var p2 = 'marcus';
  var p3 = 'anthony';
  var p4 = 'aaron';
  
  var list = [p1, p2, p3, p4];    // put the variables in a list
  
  var select =  document.getElementById("dropTest");     // get the select
  var options = select.querySelectorAll("option");       // get it's options
  
  options.forEach(function(el, i) {
    if(list[i]) {              // if list has element list[i]
      el.value = list[i];      // assign option value to list[i]
      // commenting out because OP wants only values assigned and not innerHTML
      // el.innerHTML = list[i];  // assign option innerHTML to list[i]
    }
  });
})
<select class="dropwdown-test" id="dropTest"> 
  <option>Person 1</option>
  <option>Person 2</option>
  <option>Person 3</option>
  <option>Person 4</option>
</select>

                    
...