jsTree - 通过ajax按需加载子节点

我正在尝试让 jsTree 能够按需加载子节点。我的代码是这样的：

jQuery('#introspection_tree').jstree({ 
        "json_data" : {
            "ajax" : {
                url : "http://localhost/introspection/introspection/product"
            }
    },
    "plugins" : [ "themes", "json_data", "ui" ]
    });

调用返回的json是

[
  {
    "data": "Kit 1",
    "attr": {
      "id": "1"
    },
    "children": [
      [
        {
          "data": "Hardware",
          "attr": {
            "id": "2"
          },
          "children": [
            
          ]
        }
      ],
      [
        {
          "data": "Software",
          "attr": {
            "id": "3"
          },
          "children": [
            
          ]
        }
      ]
    ]
  }
  .....
]

每个元素可以有很多子元素，树会很大。目前，这是一次加载整个树，这可能需要一些时间。当用户打开子节点时，如何实现子节点的按需加载？

提前致谢。

Irishka 为我指明了正确的方向，但并没有完全解决我的问题。我摆弄了她的答案并想出了这个。使用两个不同的服务器功能只是为了清楚起见。第一个列出了顶级的所有产品，第二个列出了给定产品 ID 的所有子项：

jQuery("#introspection_tree").jstree({
    "plugins" : ["themes", "json_data", "ui"],
    "json_data" : {
        "ajax" : {
            "type": 'GET',
            "url": function (node) {
                var nodeId = "";
                var url = ""
                if (node == -1)
                {
                    url = "http://localhost/introspection/introspection/product/";
                }
                else
                {
                    nodeId = node.attr('id');
                    url = "http://localhost/introspection/introspection/children/" + nodeId;
                }

                return url;
            },
            "success": function (new_data) {
                return new_data;
            }
        }
    }
});

从函数返回的json数据是这样的（注意每个节点中的state=close）：

[
  {
    "data": "Kit 1",
    "attr": {
      "id": "1"
    },
    "state": "closed"
  },
  {
    "data": "KPCM 049",
    "attr": {
      "id": "4"
    },
    "state": "closed"
  },
  {
    "data": "Linux BSP",
    "attr": {
      "id": "8"
    },
    "state": "closed"
  }
]

不需要静态数据，树现在在每个级别都是完全动态的。