Как проверить значение выпадающего списка без jquery? - PullRequest
Новая
       3

Как проверить значение выпадающего списка без jquery?

0 голосов
/ 22 марта 2019

Я хочу создать функцию, которая при нажатии кнопки проверяет, какая опция выбрана из каждого выпадающего списка. Не знаю, как мне это сделать, и все, что я нахожу в Интернете, - это jquery, то, чем я не хочу пользоваться. Это может быть невозможно, что было бы неплохо, потому что я мог бы просто использовать вводимые значения, но решил, что я могу также спросить здесь. 

<body>
    <select class="Alder" name="Alder">
      <option id="B">0-12år</option>
      <option id="V">Eldre en 12år</option>
    </select>
    <select class="Dager" name="Dager">
      <option id="1">1 Dag</option>
      <option id="2">2 Dager</option>
      <option id="3">3 Dager</option>
      <option id="4">4 Dager</option>
      <option id="5">5 Dager</option>
      <option id="6">6 Dager</option>
      <option id="7">7 Dager</option>
    </select>
    <button id="prisKnapp" type="button" name="button">Regn ut pris</button>
  </body>

Ответы [ 2 ]

0 голосов
/ 22 марта 2019

Дайте option s value s вместо id s, и затем вы можете использовать FormData API для сериализации формы, как если бы она была отправлена ​​"традиционно" и доступа значения, которые будут отправлены: 

document.getElementById("f").addEventListener("submit", (event) => {
  event.preventDefault();
  const fd = new FormData(event.target);
  alert(
    'Dager: ' + fd.get('Dager') + '\n' + 
    'Alder: ' + fd.get('Alder')
  );
});
<body>
  <form id="f">
    <select class="Alder" name="Alder">
      <option value="B">0-12år</option>
      <option value="V">Eldre en 12år</option>
    </select>
    <select class="Dager" name="Dager">
      <option value="1">1 Dag</option>
      <option value="2">2 Dager</option>
      <option value="3">3 Dager</option>
      <option value="4">4 Dager</option>
      <option value="5">5 Dager</option>
      <option value="6">6 Dager</option>
      <option value="7">7 Dager</option>
    </select>
    <button type="submit" name="button">Regn ut pris</button>
  </form>
</body>
0 голосов
/ 22 марта 2019

Вы можете получить значение из всех раскрывающихся входных данных, назначив класс для каждого входного выбора, скажем, вы используете select имя класса.

html: 

<body>
    <select class="Alder select" name="Alder">
    <option id="B">0-12�r</option>
    <option id="V">Eldre en 12�r</option>
    </select>
    <select class="Dager select" name="Dager">
    <option id="1">1 Dag</option>
    <option id="2">2 Dager</option>
    <option id="3">3 Dager</option>
    <option id="4">4 Dager</option>
    <option id="5">5 Dager</option>
    <option id="6">6 Dager</option>
    <option id="7">7 Dager</option>
    </select>
    <button id="prisKnapp" type="button" onclick='getVal()' name="button">Regn ut pris</button>
</body>

javascript: 

var sel = document.getElementsByClassName("select");

function getVal(){
    for (const key in sel) {
        if (sel.hasOwnProperty(key)) {
            console.log(sel[key].value);
        }
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...