JavaScript将选择菜单选项附加到div标记

作为一名JavaScript的新手，我了解了如何将下拉菜单中选定对象的数量显示在

中。但是我正在试图弄清楚如何使下拉菜单中选择的文本显示在

中

window.onload=函数（）{
var eSelect=document.getElementById（'question1'）；
var optOtherReason=document.getElementById（'displayresponse'）；
eSelect.onchange=函数（）{
如果（eSelect.selectedIndex==2）{
optOtherReason.style.display='block'；
var li=document.createElement（“li”）；
li.innerHTML=eSelect.selectedIndex；
var ul=document.getElementById（“appendedtext”）；
ul.儿童（li）；
}否则{
optOtherReason.style.display='none'；
} 
} 
}  

理由1
理由2
其他原因
回应这里

---

将

var options=document.getElementsByTagName（“选项”）

与

选项[eSelect.selectedIndex].innerHTML结合使用，如下所示：

window.onload = function() {
    var eSelect = document.getElementById('question1');
    var optOtherReason = document.getElementById('displayresponse');

    // the option elements
    var options = document.getElementsByTagName("option");

    eSelect.onchange = function() {
        if(eSelect.selectedIndex === 2) {
            optOtherReason.style.display = 'block';

            var li = document.createElement("li");

            // eSelect.selectedIndex is the index (call it `n`) of the option
            // get that `n`-th option element from `options`
            // get its `.innerHTML`
            // and set to `li.innerHTML`
            li.innerHTML = options[eSelect.selectedIndex].innerHTML;

            var ul = document.getElementById("appendedtext");
            ul.appendChild(li);
        } else {
            optOtherReason.style.display = 'none';
        } 
    } 
}  

编辑：
如果要显示每个更改，请执行以下操作：

在已排序的列表中—
在
分区中
-
我会这样做：

var select = document.getElementById('question1'),
    response = document.getElementById('displayresponse');
select.onchange = function() {
    var selectedOption = select.options[select.selectedIndex].innerHTML;
    response.innerHTML = selectedOption;
    response.style.display = 'inline';
}

您的示例似乎仅在选择最后一个选项时显示索引。两个问题。1） 是否要显示选项的值或文本（例如“其他”与“其他原因”）。2） 您希望此选项适用于任何选项，还是仅适用于上面示例中的最后一个选项？1.选项的文本2.任何option@fzzle好的，我想那些
，如果不碰的话。我现在已将其配置为。它是有效的。希望您满意。@fzzle并为OP添加了一些选项。请参阅我的答案编辑。@fzzle我要求查看编辑中给出的选项。请看一看<代码>演示
已删除。@fzzle请解释它是如何工作的？意思：1）它根本不起作用吗？（控制台错误，如果有）2）选择其他选项时不显示输出？3） 其他一些。很抱歉，我无法重现此问题。@fzzle请解释。我在等待你的答复。
window.onload = function() {
    var eSelect = document.getElementById('question1');
    var optOtherReason = document.getElementById('displayresponse');

    // the option elements
    var options = document.getElementsByTagName("option");

    eSelect.onchange = function() {
        if(eSelect.selectedIndex === 2) {
            optOtherReason.style.display = 'block';

            var li = document.createElement("li");

            // eSelect.selectedIndex is the index (call it `n`) of the option
            // get that `n`-th option element from `options`
            // get its `.innerHTML`
            // and set to `li.innerHTML`
            li.innerHTML = options[eSelect.selectedIndex].innerHTML;

            var ul = document.getElementById("appendedtext");
            ul.appendChild(li);
        } else {
            optOtherReason.style.display = 'none';
        } 
    } 
}  

var select = document.getElementById('question1'),
    response = document.getElementById('displayresponse');
select.onchange = function() {
    var selectedOption = select.options[select.selectedIndex].innerHTML;
    response.innerHTML = selectedOption;
    response.style.display = 'inline';
}