onclick vs. onchange

[Christian Kruse]

Hallo LastBoyScout,

Die eigentliche Frage ist daher wo kann ich innerhalb der Optionen einen versteckten Wert definieren, den ich per onchange() im Elternelemt in der Funktion Auswerten kann? Folgender Pseudocode macht das Problem eventuell deutlicher: […]

Dafür sind die data-Attribute gedacht:

<form>
  <select name="Auswahl">
    <option data-num="21" value="A">Erste Option</option>
    <option data-num="10" value="B">Zweite option</option>
    <option data-num="7" value="C">Dritte Option</option>
  </select>
</form>

Im JS dann:

document.getElementById('auswahl').addEventListener('change', function() {
  var elem = document.getElementById('auswahl');
  var opt = elem.options[elem.selectedIndex];
  var num = opt.getAttribute('data-num');
  console.log("num:", num);
});

LG,
CK