Javascript 使用Jquery列出项目的复选框值

如何获取要显示为列表项的选中复选框的每个

值

我在下面有一个代码片段，它将值放入textArea输入，但这现在不能满足我的需要，我正在寻找一种方法，将输出的值添加到

中

函数复选框（）{
var checkbox=document.getElementsByName（'checkboxLocations'）；
var checkboxesChecked=[]；
//把它们都绕过去
对于（变量i=0；i

CB 1
CB 2
CB 3

只需接受ul认证，然后继续添加li

函数复选框（）{
var checkbox=document.getElementsByName（'checkboxLocations'）；
var checkboxesChecked=[]；
//把它们都绕过去
var liText=“”；
对于（变量i=0；i”+复选框[i]。值+””；
}
}
document.getElementById（“show”）.innerHTML=liText；
}

CB 1
CB 2
CB 3

检查以查看：

函数复选框（）{
var checkbox=document.getElementsByName（'checkboxLocations'）；
var checkboxesChecked=[]；
var ul=document.getElementById（'show'）；
ul.innerHTML=''；
//把它们都绕过去
对于（变量i=0；i'；
}
}  
}

cb1
CB 2
CB 3

在选项中，最好根据我们的知识使用jQuery来简化代码

$（“输入：复选框”）。单击（函数（）{
var checkedList=$（“输入：复选框：选中”）.toArray（）；
$（“#show”）.html（“”）
for（检查列表的var ch）{
$（“#show”）。追加（“
”+ch.value+“
”）；
}
});

CB 1
CB 2
CB 3
您可以使用以下一些良好做法：

function checkbox() {
    var locations = document.querySelectorAll('.js-locations'); // using querySelector is more flexible and more clear
    var fragment = document.createDocumentFragment(); // create a fragment for performance reasons
    var items = locations.map(function (loc) { // for any loop over arrays you may prefer to use the .map method
        const li = document.createElement('li'); // it's preferable to create the nodes and append them later
        li.textContent = loc; // or .innerHTML
        fragment.appendChild(li);
    }
    var ul = document.createElement('ul');
    document.body.appendChild(fragment); // or your target output element
}

阅读更多