<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>eleTree</title>
  <link rel="stylesheet" href="//unpkg.com/eletree/dist/css/icon.css"  type="text/css">
</head>
<body>
	<div class="eletree"></div>
	<script src="//unpkg.com/eletree/dist/eleTree.js"></script>
</body>
</html>
var data = [
  {
    "label": "安徽省",
    "id": "001",
    "isOpen": true,
    "children": [
      {
        "label": "淮北市",
        "id": "001001"
      },
      {
        "label": "马鞍山市",
        "id": "001002",
        "isOpen": true,
        "children": [
          {
            "label": "花山区",
            "id": "001002001",
            "isOpen": true,
            "children": [
              {
                "label": "霍里街道",
                "disabled": true,
                "checked": true,
                "id": "001002002001",
                "radioDisabled": true
              },
              {
                "label": "桃源路",
                "id": "001002002002"
              },
              {
                "label": "湖东路",
                "checked": true,
                "id": "001002002003",
                "radioChecked": true
              }
            ]
          },
          {
            "label": "雨山区",
            "id": "001002002"
          },
          {
            "label": "和县",
            "id": "001002003"
          }
        ]
      },
      {
        "label": "合肥市",
        "id": "001003"
      }
    ]
  },
  {
    "label": "河南省",
    "id": "002",
    "children": [
      {
        "label": "郑州市",
        "id": "002001"
      },
      {
        "label": "开封市",
        "id": "002002"
      }
    ]
  },
  {
    "label": "江苏省",
    "id": "003",
    "children": [
      {
        "label": "苏州市",
        "id": "003001"
      },
      {
        "label": "南京市",
        "id": "003002"
      },
      {
        "label": "无锡市",
        "id": "003003"
      },
      {
        "label": "徐州市",
        "id": "003004"
      }
    ]
  }
]

var ele = eleTree({
  el: '.eletree',
  data: data,
  showCheckbox: true,
  highlightCurrent: true,
  showRadio: true,
  imgUrl: "//unpkg.com/eletree/dist/images/",
  icon: {
    fold: "fold.png",
    leaf: "leaf.png",
    checkFull: ".eletree_icon-check_full",
    checkHalf: ".eletree_icon-check_half",
    checkNone: ".eletree_icon-check_none",
    dropdownOff: ".eletree_icon-dropdown_right",
    dropdownOn: ".eletree_icon-dropdown_bottom",
    loading: ".eleTree-animate-rotate.eletree_icon-loading1",
    radioCheck: "radioCheck.png",
    radioCheckNone: "radioCheckNone.png",
  }
})
ele.on('checkbox', function(data) {
  // console.log(this)
  console.log(data)
})
ele.on('radio', function(data) {
  // console.log(this)
  console.log(data)
})

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.