首页 > 解决方案 > 获取选择类选项的值

问题描述

我正在进行测试/测验,但我无法解决问题。

我喜欢从选项中获取选定的值并将其打印到结果 p。

 <div class="add">
            <div class="add__container">
                <select class="add__type">
                    <option value="0" id="a01" selected>No</option>
                    <option value="1" id="a02">Ocassionally</option>
                    <option value="2" id="a03">Yes</option>
                </select>
            </div>
        </div>

    <button class="btn" onclick="myValue()">Results</button>
    <p id="result">... </p>

这是我卡住的Javascript代码:

function myValue(){    
var e = document.getElementById("s01");
var value = e.options[e.selectedIndex].value;
var text = e.options[e.selectedIndex].text;

document.getElementById('result').innerHTML = e;

};

    

标签: javascripthtmlselecthtml-selectgetelementbyid

解决方案


// Unimportant stuff

const $ = document;
$.get = $.getElementById;

$.get('theOptions').addEventListener('change', function(event) {
  // Get the value from the select-element
  $.get('out').innerHTML = 'You selected ' + event.target.value; // Or $.get('theOptions').value
});
<select id="theOptions">
  <option value="o1">Option 1</option>
  <option value="o2">Option 2</option>
  <option value="o3">Option 3</option>
</select>
<span id="out">Nothing selected</span>


推荐阅读