高级应用演示 —— 添加自定义控件
  • 添加自定义控件说明
      1、提供两种添加自定义控件的方法
    •   一种是当事件切换(hover),即 A、鼠标移动到节点上时显示,B、鼠标移走后删除,C、当节点被选中时显示。
    •   参数:setting.addHoverBtn、setting.removeHoverBtn
    •   另一种是随着节点初始化后就始终显示。
    •   参数:setting.addDiyDom
    •   zTree内置的编辑、删除按钮都采用事件切换的方式进行显示的。
      2、位置灵活掌控
    •   至于你的自定义控件想显示在节点的什么位置,只要在保证zTree完整性的基础上可以任意添加。
    •   建议参考代码 var aObj = $("#" + treeNode.tId + IDMark_A); 这个对象对于zTree来讲,应该不会有大的变化,所以你所需要添加的控件是放在aObj的前面后面还是里面,就看你的需求了。
    •   建议不要让节点换行,否则连线会出现异常。
      3、请注意添加的控件样式设置
    •   A、自定义添加的控件请注意其高度不要超过节点的高度,这方面请根据实际情况进行调整。
    •   在这个演示中,下拉框默认高度是高于18px的,所以演示的例子中强行设定了下拉框的样式 height:16px
    •   B、自定义添加的控件因为是显示在zTree内部,因此一些css样式会直接继承自zTree的样式设定,这方面有特殊情况的用户请自行调整。
    •   需要兼容IE6的朋友要注意了,下拉框很难设置高度。
      4、自行绑定事件
    •   对于自定义添加的控件,如果需要有 click 等事件时,请在添加控件时进行事件绑定。
      5、这是一种高级应用,根据需求量体裁衣
    •   对于 zTree 来讲,添加自定义控件的功能完全是一种高级应用,请在对 zTree 的 HTML、css、数据结构都比较了解的情况下,根据不同项目的特殊需求再来决定如何添加自定义控件。