jquery - 如何动态查找下一个li标签

Question

我正在尝试在 checkbox 单击时找到下一个 li 标记。我尝试了一些方法(壁橱， parent )但出现未定义的错误。我已经创建了函数并将复选框 id 传递给它。这是我的代码

HTML

<li data-role="fieldcontain" id="liDoorConcerns" style="display: none;">
    <fieldset data-role="controlgroup" data-role="fieldcontain">
        <legend></legend>

        <input type="checkbox" name="DoorMissing" id="DoorMissing" />
        <label style="font-weight: bold; font-size: 14px" for="DoorMissing">Missing</label>

        <input type="checkbox" name="DoorDamaged" id="DoorDamaged" />
        <label style="font-weight: bold; font-size: 14px" for="DoorDamaged">Damaged</label>

        <input type="checkbox" name="DoorBoardedUp" id="DoorBoardedUp" />
        <label style="font-weight: bold; font-size: 14px" for="DoorBoardedUp">Boarded up</label>

        <input type="checkbox" name="DoorPaint" id="DoorPaint" />
        <label style="font-weight: bold; font-size: 14px" for="DoorPaint">Paint</label>

        <input type="checkbox" name="DoorDryRot" id="DoorDryRot" />
        <label style="font-weight: bold; font-size: 14px" for="DoorDryRot">Dry Rot</label>

        <input type="checkbox" name="DoorOther" id="DoorOther" />
        <label style="font-weight: bold; font-size: 14px" for="DoorOther">Other</label>
    </fieldset>
</li>

<li data-role="fieldcontain" id="liDoorConcernsComments" style="display:none;">
    <fieldset data-role="controlgroup" data-role="fieldcontain">
        <legend></legend>
        <textarea cols="20" id="DoorConcernsComments"    name="DoorConcernsComments" rows="2"></textarea>
    </fieldset>
</li>

JS 代码:

function test(ida) {
    debugger;
    var element = $('#' + ida);
    var get = element.find('li');
    var li_id = get.first().id;
    alert("id" + li_id);
}

Answer 1

据我了解，您的处理方式是错误的。试试这个:

$('input[type="checkbox"]').on('click', function() {
    var li = $(this).closest('li').next('li');

    alert(li.prop('id'));
});

您所需要做的就是获取最近的<li> ，然后找到<li>在那之后。不需要从字符串构造选择器。

您的未定义错误可能源于此行:

alert("id" + li_id);

元素li_id是一个 jQuery 对象，它没有 .id属性(property)。要获得此信息，请使用 li.prop('id')或li[0].id .