Question

我的HTML：

<input type="checkbox" value="113" id="product_113" class="chk_product_name" name="product[parentid][childid][]">
<label for="product_113">Samsung<label>
<br>
<input type="checkbox" value="114" id="product_114" class="chk_product_name" name="product[parentid][childid][]">
<label for="product_114">Nokia<label>
<br>
<input type="checkbox" value="115" id="product_115" class="chk_product_name" name="product[parentid][childid][]">
<label for="product_115">Apple<label>
<br>
<input type="checkbox" value="116" id="product_116" class="chk_product_name" name="product[parentid][childid][]">
<label for="product_116">LG<label>

我只想在选中复选框时获取每个标签的值我在jquery中尝试这个：

$('[name="product[parentid][childid][]"]').click(function(){            
    $('[name="product[parentid][childid][]"]:checked').each(function() {
        alert($("label:for:product_"+this.value).html );
    });         
});

see this fiddle.

Answer 1

您需要关闭标签。使用

<label for="product_113">Samsung</label>

而不是

<label for="product_113">Samsung<label>

的JavaScript

$('[name="product[parentid][childid][]"]').click(function () {
    $('[name="product[parentid][childid][]"]:checked').each(function () {
        alert($("label[for='product_" + this.value + "']").html());
        //OR
        alert($('label[for=' + this.id + ']').html());
    });
});

DEMO

此外，我建议您使用change事件代替click

Answer 2

尝试这样的事情，FIDDLE

另外请不要忘记关闭'label'标签

$('[name="product[parentid][childid][]"]').click(function () {
    alert($('label[for=' + this.id + ']').html());
});

Answer 3

应该是：

$('[name="product[parentid][childid][]"]').click(function () {
    $('[name="product[parentid][childid][]"]:checked').each(function () {
        alert($("label[for='product_" + $(this).val()+"']").html());
    });
});

Updated fiddle here.

Answer 4

我认为这很简短，易读且干净

$('.chk_product_name').change(function(){ 
  if (this.checked){ alert($('label[for='+this.id+']').text());}
});

Answer 5

这是一个更短的版本： http://jsfiddle.net/Tq4C2/7/

$('[name="product[parentid][childid][]"]').click(function(){
    alert($(this).next().text());
});

您的<label>标记也未关闭。

在选中复选框时获取标签值

5 个答案: