Javascript 根据变量'；更改选择框选项；s输出

大家好，我正在学习javascript和jquery，有一个相当简单的问题我想不出来。 我有一个3复选框，其中我的函数在单击时被调用

<div id="status_selected">
    <input type="checkbox" value="internal" onclick="myFunction()" 
           name="status[]" id="status_">internal            
    <input type="checkbox" value="external" onclick="myFunction()"
           name="status[]" id="status_">external
    <input type="checkbox" value="normal" onclick="myFunction()"
           name="status[]" id="status_">normal
</div>

内部的
外部的
正常的

这是一个选择框，根据上面复选框中选择的内容，应该填写哪些人的选项

<select id="display_status" style = "display:none;"></select>

因此，如果选中“内部”和“外部”，则上述选择框的选项应相同，如果更改，则也应相同

<script>
function myFunction() {
    var names = [];
    $('#status_selected input[type="checkbox"]:checked').each(function (i, el) {
        names.push(el.value);
    });
    document.getElementById('display_status').style.display = 'block';
    document.getElementById('display_status').innerHTML =
        '<option value="1">1</option><option value="2">2</option>';
}
</script>

函数myFunction（）{
变量名称=[]；
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
名称.推送（el.值）；
});
document.getElementById（'display_status'）。style.display='block'；
document.getElementById（'display_status'）.innerHTML=
'12';
}

这是我在上面编写的函数，我能够在names变量中检查所有名称，但我不知道如何将其作为选项传递给innerHTML。目前我有硬编码选项1和2。如何将变量值传递给它

---

感谢您在使用jQuery时提供的帮助。完全使用它

HTML

内部的
外部的
正常的

代码

$（文档）.ready（函数（）{
$（'#status_selected input[type=“checkbox”]”）。on（'change'，function（）{
$（“#显示_状态”）.empty（）；//清除以前的HTML
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
//附加选项以选择
$（“#显示状态”）.append（“+el.value+”）；
});
$（“#显示#状态”）.show（）；//显示选择
});
});

参考：

---

当您使用jQuery时。完全使用它

HTML

内部的
外部的
正常的

代码

$（文档）.ready（函数（）{
$（'#status_selected input[type=“checkbox”]”）。on（'change'，function（）{
$（“#显示_状态”）.empty（）；//清除以前的HTML
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
//附加选项以选择
$（“#显示状态”）.append（“+el.value+”）；
});
$（“#显示#状态”）.show（）；//显示选择
});
});

参考：

试试这个：

function myFunction()
{
var html="";
$('#status_selected input[type="checkbox"]:checked').each(function (i, el){
  html+="<option value="+el.value+">"+el.value+"</option>";
});
 document.getElementById('display_status').style.display='block';;
 document.getElementById('display_status').innerHTML=html;
}

函数myFunction（）
{
var html=“”；
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
html+=“”+el.value+“”；
});
document.getElementById（'display_status'）.style.display='block'；；
document.getElementById（'display_status'）。innerHTML=html；
}

你可以把整个事情缩小到：

function myFunction(){
$('#display_status').empty();
$('#display_status').css('display','block')
 $('#status_selected input[type="checkbox"]:checked').each(function (i, el){
  $('#display_status').append("<option value="+el.value+">"+el.value+"</option>");
 });}

函数myFunction（）{
$（“#显示#状态”）.empty（）；
$（'display#u status'）.css（'display'，'block'））
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
$（“#显示状态”）.append（“+el.value+”）；
});}

试试这个：

function myFunction()
{
var html="";
$('#status_selected input[type="checkbox"]:checked').each(function (i, el){
  html+="<option value="+el.value+">"+el.value+"</option>";
});
 document.getElementById('display_status').style.display='block';;
 document.getElementById('display_status').innerHTML=html;
}

函数myFunction（）
{
var html=“”；
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
html+=“”+el.value+“”；
});
document.getElementById（'display_status'）.style.display='block'；；
document.getElementById（'display_status'）。innerHTML=html；
}

你可以把整个事情缩小到：

function myFunction(){
$('#display_status').empty();
$('#display_status').css('display','block')
 $('#status_selected input[type="checkbox"]:checked').each(function (i, el){
  $('#display_status').append("<option value="+el.value+">"+el.value+"</option>");
 });}

函数myFunction（）{
$（“#显示#状态”）.empty（）；
$（'display#u status'）.css（'display'，'block'））
$（'#status_selected input[type=“checkbox”]：checked'）。每个（函数（i，el）{
$（“#显示状态”）.append（“+el.value+”）；
});}

对名称数组使用

映射

函数，并生成如下选项：

names.map(function(name){
    $('#display_status').append('<option value="'+name+'">'+name+'</option>');
});

您可以简单地将Jquery用作

$('#display_status').show();

---

对名称数组使用

map

函数并生成如下选项：

names.map(function(name){
    $('#display_status').append('<option value="'+name+'">'+name+'</option>');
});

您可以简单地将Jquery用作

$('#display_status').show();

---

HTML有一个问题：您有多个元素具有相同的

id

属性（

status

）。元素id在文档中必须是唯一的。确实，如果希望多个元素具有相同的“指示符”，则应使用

class

而不是

id

。HTML有一个问题：您有多个元素具有相同的

id

属性（

状态

）。元素id在文档中必须是唯一的。如果希望多个元素具有相同的“指示符”，则应该使用

class

而不是

id

。可以用jQuery方式编辑它。如果他正在学习JS和jQuery，ha应该学习使用jQuery而不是经典的JS语法。你可以用jQuery的方式编辑它。如果他正在学习JS和jQuery，ha应该学习使用jQuery而不是经典的JS语法。感谢您用注释和参考资料清楚地解释。帮助我学到了很多东西。谢谢你用评论和参考资料清楚地解释。帮助我学到很多东西。