回到课程

树形菜单

重要程度: 5

创建一个单击可以显示/隐藏子节点的树形菜单:

要求:

  • 只有一个事件处理器(使用委托)
  • 单击节点标题以外的地方(空白区域)不做任何处理。

打开一个任务沙箱。

解决方案分为两步。

  1. 将每个树节点的标题用 <span> 包裹起来。然后我们可以在 :hover 上使用 CSS 样式,并准确地处理文本上的单击事件,因为 <span> 宽度正好是文本宽度(与没有它不同)。
  2. tree 的根节点设置处理器来处理 <span> 中标题的单击事件。

使用沙箱打开解决方案。