jquery.dynatree.jsjQuery树形插件

联合创作 · 2023-10-02 12:18

dynatree 是一个 jQuery 的插件,用来在网页上显示树形控件的脚本。

示例代码:

<html>
<head>
  <!-- 1. Include jQuery and dynatree libraries: -->
  <script src='../jquery/jquery.js' type='text/javascript'></script>
  <script src='../jquery/ui.core.js' type='text/javascript'></script>
  <script src='../jquery/jquery.cookie.js' type='text/javascript'></script>

  <link href='../src/skin/ui.dynatree.css' rel='stylesheet' type='text/css'>
  <script src='../src/jquery.dynatree.js' type='text/javascript'></script>
   
  <script type='text/javascript'>
  // Add code to initialize the tree when the document is loaded:
  $(function(){
    // 2. Attach the dynatree widget to an existing <div id="tree"> element
    //    and pass the tree options as an argument to the dynatree() function:
    $("#tree").dynatree({
      // Pass an array of nodes (and child nodes)
      children: [
        {title: "Item 1"},
        {title: "Folder 2", isFolder: true, key: "folder2",
          children: [
            {title: "Sub-item 2.1"},
            {title: "Sub-item 2.2"}
          ]
        },
        {title: "Item 3"}
      ],
      onActivate: function(dtnode) {
        // This function is called, when a node is clicked
        // A DynaTreeNode object is passed as argument.
        alert("You activated " + dtnode.data.title);
      }
    });
  });
  </script>
</head>
<body>
  <!-- 3. Add a <div> element where the tree should appear: -->
  <div id="tree"> </div>
  [...]
</body>
</html>

浏览 4
点赞
评论
收藏
分享

手机扫一扫分享

编辑
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑
举报