jQuery点击child类子元素获取对应parent父级div的索引值问题

实现代码 #

// 绑定child元素的点击事件
$('.child').click(function() {
    // 获取当前点击元素所属的parent节点
    let currentParent = $(this).closest('.parent');
    // 计算parent的序号（从1开始计数）
    let parentIndex = $('.parent').index(currentParent) + 1;
    // 测试输出，可根据业务需求替换为其他逻辑
    console.log('当前父级parent的序号为：', parentIndex);
});

核心说明 #

• 这里用closest('.parent')查找父级，相比直接用parent()兼容性更好，就算后续child外层额外嵌套了其他DOM元素，也能正确匹配到最近的class为parent的节点。
• jQuery的index()方法默认返回从0开始的下标，所以加上1之后就能得到你需要的从1开始的计数结果，第二个parent下的child点击后会返回数值2，完全匹配需求。

内容的提问来源于stack exchange，提问作者Nicolas Gruwe