如何在for循环下动态创建的div使用Jquery选择器?

时间:2014-05-30 05:32:52

标签: jquery

在for循环中,我正在以这种方式构建div,在适用的时候添加动态内容。

<div data-role="collapsible">
    <h3>Popcorn</h3>
    <div class="prd-items-detials">
        <ul>
            <li class="head">
                <form>
                    <input type="checkbox" class="checkboxclas" name="checkbox-mini-0" id="checkbox-mini-0" data-mini="true">
                    <label class="testtt" for="checkbox-mini-0">Small Pack 150g</label>
                </form>
            </li>
            <li class="prd-items-qt">
                <div class="col">
                    <i class="minus"></i>
                    <i class="qt">12</i>
                    <i class="plus"></i>
                </div>
                <div class="col">

                </div>
                <div class="col">
                    Rs: 150/-
                </div>
            </li>
        </ul>

    </div>
</div>

实际代码

for (var k = 0; k < responseinner[i].type.length; k++) 
{
activateUiHTML.append('<div  data-role="collapsible"><h3>' + obj.name + '</h3><div class="prd-items-detials"><ul><li class="head"><form><input type="checkbox" class="checkboxclas" name="checkbox-mini-0" id="' + random_number + '" data-mini="true"><label class="testtt" for="checkbox-mini-0">' + responseinner[i].type[k] + '</label></form></li><li class="prd-items-qt"><div class="col"><i class="minus"></i><i class="qt">1</i><i class="plus"></i></div><div class="col"></div><div id ="'+responseinner[i].type[k]+'" class="col">Rs: ' + responseinner[i].price[k] + '/-</div></li></ul></div></div>');
}

当我以这种方式注册复选框事件时,我在点击复选框时获得了多个值。 (我的意思是其他复选框的文本也出现在for循环中

$(document).on("click", ".checkboxclas", function (e) {
if($(this).is(':checked'))
{      
var labelAttr = $('label').text();
alert(labelAttr);
}
}

如何仅返回复选框的特定文本?

2 个答案:

答案 0 :(得分:1)

您必须使用closest()获取其父表单元素,并使用find()获取标签,如下所示:

$(document).on("click", ".checkboxclas", function (e) {
if($(this).is(':checked'))
{      
var labelAttr = $(this).closest("form").find("label.testtt").text();
alert(labelAttr);
}
}

答案 1 :(得分:1)

试试这个:

$(document).on("click", ".checkboxclas", function (e) {
    if($(this).is(':checked')) {
        var labelAttr = $('label[for='+$(this).attr('name')+']').text();
        alert(labelAttr);
    }
});