如何获取复选框的文本？
我有以下一组复选框：
<ul class="checkbox_list">
<li><input name="mensajes[receptores_list][]" type="checkbox" value="5" id="mensajes_receptores_list_5" /> <label for="mensajes_receptores_list_5">Carlos (Admin)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="1" id="mensajes_receptores_list_1" /> <label for="mensajes_receptores_list_1">Jorge (Admin)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="3" id="mensajes_receptores_list_3" /> <label for="mensajes_receptores_list_3">Marisa (Admin)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="6" id="mensajes_receptores_list_6" /> <label for="mensajes_receptores_list_6">Christian (Apuntes)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="4" id="mensajes_receptores_list_4" /> <label for="mensajes_receptores_list_4">Julieta (Contable)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="2" id="mensajes_receptores_list_2" /> <label for="mensajes_receptores_list_2">Vicky (Contable)</label></li>
</ul>
使用javascript，我如何访问每个项目的文本。例如，对于id=“mensajes\u receptores\u list\u 5”的元素，我想得到文本“Carlos（Admin）”
共有3个答案
这里有一个现代的vanilla JS解决方案，它应该适用于查找与复选框关联的标签的一般情况：
function getCheckboxLabel(checkbox) {
if (checkbox.parentNode.tagName === 'LABEL') {
return checkbox.parentNode
}
if (checkbox.id) {
return document.querySelector('label[for="' + checkbox.id + '"]')
}
}
因为根据这个SO答案，有两种方法可以创建<代码>
首先，您可以将标签元素包裹在输入元素周围：
<label>Input here:
<input type="text" name="theinput" id="theinput">
</label>
另一种方法是使用for属性，为其提供相关输入的ID：
<label for="theinput">Input here:</label>
<input type="text" name="whatever" id="theinput">
因此，要回答如何获取文本的原始问题，只需将此函数与文本内容一起使用即可：
function getCheckboxLabel(checkbox) {
if (checkbox.parentNode.tagName === 'LABEL') {
return checkbox.parentNode
}
if (checkbox.id) {
return document.querySelector('label[for="' + checkbox.id + '"]')
}
}
let checkboxes = document.querySelectorAll('input[type=checkbox]')
checkboxes.forEach((checkbox) => {
let label = getCheckboxLabel(checkbox)
if (label) {
console.log('label text:', label.textContent)
} else {
console.log('could not find the label of', checkbox)
}
})<!-- Sample HTML taken from OP -->
<ul class="checkbox_list">
<li><input name="mensajes[receptores_list][]" type="checkbox" value="5" id="mensajes_receptores_list_5" /> <label for="mensajes_receptores_list_5">Carlos (Admin)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="1" id="mensajes_receptores_list_1" /> <label for="mensajes_receptores_list_1">Jorge (Admin)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="3" id="mensajes_receptores_list_3" /> <label for="mensajes_receptores_list_3">Marisa (Admin)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="6" id="mensajes_receptores_list_6" /> <label for="mensajes_receptores_list_6">Christian (Apuntes)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="4" id="mensajes_receptores_list_4" /> <label for="mensajes_receptores_list_4">Julieta (Contable)</label></li>
<li><input name="mensajes[receptores_list][]" type="checkbox" value="2" id="mensajes_receptores_list_2" /> <label for="mensajes_receptores_list_2">Vicky (Contable)</label></li>
</ul>
按Jquery
function getLabel(id)
{
return $("#"+id).next("label").html();
}
//id of checkbox ,you want to get label of
var label=getLabel('mensajes_receptores_list_1');
alert(label);
JSFIDLE公司http://jsfiddle.net/pcQgE/1/
我会这样处理它：
function getLabelText(needle) {
var labels = document.getElementsByTagName("label");
var texts = [];
for (var i = 0; i < labels.length; i++) {
var label = labels[i];
if(label.getAttribute("for") == needle) {
console.log(label.innerText);
texts.push(label.innerText);
}
}
return texts;
}
-
问题内容： 我有一组具有相同名称的输入复选框，并且我想确定已使用JavaScript选中了哪些复选框，如何实现呢？我只知道如何获取所有复选框，如下所示： 问题答案： 一个简单的for循环，用于测试属性并将选中的属性附加到单独的数组中。从那里，如果需要，您可以进一步处理数组。
-
问题内容： 所以我得到的代码看起来像这样： 我只需要Javascript来获取当前选中的任何复选框的值。 编辑 ：要添加，将只有一个复选框。 问题答案： 对于现代浏览器 ： 通过使用： 没有_以下内容的 _纯javascript ：
-
所以我有这样的代码: 我只需要Javascript来获取当前选中的任何复选框的值。 编辑：要添加，只有一个复选框。
-
问题内容： 我已经编辑了数据，并试图仅获取用户已选择的数据。我不确定该怎么做，这就是我所拥有的： HTML： JS： 我确实以一种方式使它工作-通过向每个对象添加属性并将复选框的更改为，然后可以在函数中对此进行过滤。但是，这似乎效率很低，如果可以避免，我不想在模型中添加额外的属性。 有没有更好的办法 ？ 问题答案： 的JavaScript HTML http://plnkr.co/edit/lqt
-
问题内容： 我正在 struts2 应用程序上工作，在该应用程序中我正在使用 displaytag 进行分页支持。 现在我要为表格中的每一行选择一个复选框，以便执行此操作。 到这里为止一切正常。现在我想删除通过复选框选中的所有国家。 为此，我要检查的国家/地区的ID。为此，我必须采用数组中的值。 问题是如何从jsp发送值，然后在action类中获取它 问题答案： 如果将String []添加到名称
-
问题内容： 我在Flask Python中使用Bootstrap。 选中复选框后，父标签的类为“活动”，我想获取是否选中了复选框。有什么办法吗？ 问题答案： 你可以尝试以下操作： 在烧瓶中： ``` value = request.form.getlist(‘check’) value = [u’edit’] ``` 你还可以获取具有相同名称属性的多个复选框的值。