如何在Kendo PanelBar的onSelect函数中获取选中面板的索引

没问题，这个需求很好实现！你只需要借助jQuery的index()方法，在select事件里直接获取选中项在同级元素中的位置就能得到从0开始的索引值，完全匹配你的要求。

具体实现代码 #

$("#yourPanelBarId").kendoPanelBar({
  select: function(e) {
    // 获取选中面板的索引（从0开始计数）
    const selectedIndex = $(e.item).index();
    console.log("当前选中面板的索引：", selectedIndex);
    // 这里可以根据索引执行你需要的业务逻辑
  }
});

原理说明 #

• e.item是Kendo PanelBar触发select事件时传递的选中项DOM元素（对应面板的<li>标签）。
• 调用jQuery的index()方法后，会返回该元素在同级兄弟元素中的位置序号，默认从0开始计数，正好是你想要的0、1、2...这类索引格式。

嵌套面板的特殊处理 #

如果你的PanelBar包含嵌套子面板，可根据需求区分索引类型：

• 要获取顶级面板的索引：确保选中的是顶级项，直接用$(e.item).index()即可。
• 要获取子面板在父面板中的索引：同样调用$(e.item).index()，此时返回的是它在父面板子项中的位置序号（依然从0开始）。

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