0

我正在尝试检索所选复选框的文本，如下所示：

HTML：

<label class="checkbox">        
    <input type="checkbox" name="priority" value="2" checked="checked">2 - Critical
</label>
<label class="checkbox">        
    <input type="checkbox" name="priority" value="3">3 - Important
</label>

jQuery：

$('#priorityContents input:checkbox:checked').each(function() {
    if(priorityText.length > 0) {
        priorityText = priorityText + "|";
    }
    priorityText = priorityText + $(this).text();
});

alert(priorityText);

我希望看到：

2 - Critical

我的控制台中没有任何错误。我错过了什么？

4

8 回答 8

2

你可以试试：

<input id="cb" type="checkbox" name="priority" value="2" checked="checked">
<label for='cb' class="checkbox"> 2 - Critical</label>


$('#priorityContents input[type="checkbox"]:checked').each(function() {
    var txt = $(this).next('label').text();
});

请注意，:checkbox选择器已弃用，您可以input[type="checkbox"]改用。

于 2012-07-26T17:57:00.787 回答
1

根据您发布的代码，您为什么希望看到该结果？在该代码中，您从未尝试检索文本。我建议：

$('#priorityContents input:checkbox:checked').each(function() {
    var next = this.nextSibling,
        text = next.nodeType == 3 ? next.nodeValue : '';
    console.log(text);
});

JS 小提琴演示。

这将遍历给定元素中的每个选中的复选框id，查看当前节点的下一个兄弟节点（不是 jQuery 对象，普通 DOM 节点），如果该节点是一个textNode（nodeType等于的节点），则3分配nodeValue(该节点的文本内容）到变量。

如果它不是 a textNode，那么它会分配一个空字符串。

于 2012-07-26T17:57:33.883 回答
1

您想要访问label元素，它是以下元素的父元素input：

$('#priorityContents input[type="checkbox"]:checked').parent();

这是小提琴：http: //jsfiddle.net/Hk63N/

为了提高性能，您应该考虑拆分选择器：

var priorityText = '';

$('#priorityContents input[type="checkbox"]').filter(':checked').parent().each(function() {
    if ( ! priorityText ) {
        priorityText = priorityText + "|";
    }
    priorityText = priorityText + $(this).text();
});

alert(priorityText);​

来自jQuery 文档：

为了在使用这些选择器时获得最佳性能，首先使用纯 CSS 选择器选择一些元素，然后使用 .filter()。

这是这个的小提琴：http: //jsfiddle.net/Hk63N/1/

于 2012-07-26T17:58:46.880 回答
0

首先，仅将文本包装在<label>标签中，无论如何这对于可用性来说都是一个好主意。将for属性分配给复选框的 ID：

<input type="checkbox" name="priority" id="priority-2" value="2" checked="checked">
<label class="checkbox" for="priority-2">        2 - Critical</label>

然后您可以使用 jQuery 选择器轻松定位它：

$('#priorityContents input:checkbox:checked').each(function() {
    priorityText = $('label[for="'+$(this).attr('id')+'"]').text();
    ...
});

也就是说，最简单的方法可能是data-prioritytext在复选框的属性中添加您想要的任何文本，然后.data('prioritytext')在代码中提取它。

于 2012-07-26T17:59:27.487 回答
0

您的代码中肯定缺少一些东西。就像 #priorityContents 元素一样，如果您正在搜索它，这非常重要。

无论如何，我创建了这个适合我的演示。基本上你错了我相信这部分：

priorityText = priorityText + $(this).text();

实际的复选框元素不拥有 .text()。你需要去父母那里获得其中包含的实际价值。

演示

于 2012-07-26T18:01:18.073 回答
0

试试这个

var checkedTxt=$('.checkbox :checked').parent().text();
console.log(checkedTxt);

演示。

于 2012-07-26T18:02:45.900 回答
-1

var name=$(this).parent().text();

您将获得该复选框的文本在 html 复选框中没有获取文本数据的属性。所以用 parent()函数来取

于 2015-01-14T09:32:21.733 回答
-1

您可以使用 jquery 以这种方式检索选中复选框的文本。

var value = $(document).find('input[type="checkbox"]:checked').attr('value');
于 2015-01-14T10:31:53.900 回答