我有一个创建 jstree 节点的 jQuery each 循环。树节点创建后，我想立即展开它。早些时候，我遇到了一次创建所有节点而不是一次创建一个的问题。
Test(); //this is being called from another function
function Test() {
var obj = [{'name': 'Frank', 'age': '23'}, {'name': 'Gina', 'age': '29'}];
$.each(obj, function(){
CreateTreeNode(this.name); //function from an external js file
DoSomething(this.name);
});
};
function CreateTreeNode(node) {
setTimeout(function(){
$('<li />', {html: node}).appendTo('#tree > ul');
},1000);
};
function DoSomething(node){
alert('doing something else for ' + node);
};
所以我在这个论坛的各种线程的帮助下修改了代码。喜欢：循环使用 .each 并在 Jquery 中延迟
最后我提出了这个创建节点但不扩展它的解决方案。似乎扩展代码在创建节点之前运行。为了展示这个功能，我尝试创建一个简单的 jsFiddle 示例。希望这将有助于解决我的问题。代码片段：
Test(); //this is being called from another function
function Test() {
var obj = [{'name': 'Frank', 'age': '23'}, {'name': 'Gina', 'age': '29'}];
var i = -1;
var delayed = setInterval(function(){
if(++i < obj.length){
CreateTreeNode(obj[i].name); //function from an external js file
DoSomething(obj[i].name); //Expand the node
} else {
clearInterval(delayed)
}
}, 3000);
//ExpandAllNodes(); this didn't work too
};
根据其中一位贡献者的请求添加原始代码库（我知道那里的代码很糟糕）。如果没有 setTimeouts，jsTree 不知何故无法工作。我只是使用在外部文件中可用的这段代码，但我可以自由更改，我尝试按照评论部分中的建议进行更改，除了最后一个节点没有展开之外，它几乎可以工作：
function zBuildOrderDetailTreeView() {
var newOrderOptions = '';
var interval = 500;
var index = -1;
var delayed = setInterval(function () {
if (++index < m_selectedOrderList.length) {
newOrderOptions = {
OrderTitle: m_selectedOrderList[index].ShortDescription,
orderTypeId: m_selectedOrderList[index].SUBDOMAINS,
CatalogDescription: m_selectedOrderList[index].ShortDescription
};
m_cpoeTree.AddOrder(newOrderOptions, m_cpoeTree.ExpandAllNodes);
} else {
clearInterval(delayed);
}
}, 500);
// Expand all the nodes by default
//setTimeout(function () {
// m_cpoeTree.ExpandAllNodes();
//}, m_selectedOrderList.length * 1000);
}
this.AddOrder = function (options, callback) {
var orderId = _.uniqueId('order_');
var orderMetadata = {
"orderTypeId": options.orderTypeId,
"OrderTitle": options.OrderTitle,
"ConceptId": options.ConceptId,
"CatalogDescription": options.CatalogDescription,
"LOINCCode" : options.LOINCCode,
"LOINCDescription" : options.LOINCDescription,
"LOINCTypeCode" : options.LOINCTypeCode,
"CPTCode" : options.CPTCode,
"CPTDescription" : options.CPTDescription,
"SNOMEDCode" : options.SNOMEDCode,
"SNOMEDDescription" : options.SNOMEDDescription,
"Diagnoses": options.Diagnoses,
"FacilityId" : options.FacilityId == undefined ? '' : options.FacilityId,
"FacilityName" : options.FacilityName == undefined ? '' : options.FacilityName,
"DueDate" : options.DueDate == undefined ? '' : options.DueDate,
"PriorityId" : options.PriorityId == undefined ? '' : options.PriorityId,
"PriorityName" : options.PriorityName == undefined ? '' : options.PriorityName,
"FastingId" : options.FastingId == undefined ? '' : options.FastingId,
"FastingName" : options.FastingName == undefined ? '' : options.FastingName,
"ContrastId" : options.ContrastId == undefined ? '' : options.ContrastId,
"ContrastName" : options.ContrastName == undefined ? '' : options.ContrastName,
"SpecialInstructions" : options.SpecialInstructions == undefined ? '' : options.SpecialInstructions
};
var orderClass = '';
switch (options.orderTypeId) {
case 1:
if (!orderMetadata.FacilityName || !orderMetadata.DueDate || !orderMetadata.PriorityName || !orderMetadata.FastingName || !orderMetadata.Diagnoses.names) {
orderClass = ' invalid';
}
break;
default:
if (!orderMetadata.FacilityName || !orderMetadata.DueDate || !orderMetadata.PriorityName || !orderMetadata.Diagnoses.names) {
orderClass = ' invalid';
}
break;
}
var orderNode = { "title" : orderMetadata.OrderTitle, "state": "open", "li_attr" : { "id" : orderId, "class" : "order" + orderClass,
"metadata" : JSON.stringify( orderMetadata) }, "data" : { "class": "mynode" } };
var matchingObj = zMatchRequisition(orderMetadata);
if(matchingObj.matchingOrderFound) {
return '';
}
if (!matchingObj.matchingRequisitionFound) {
that.AddRequisition(matchingObj, options, orderNode, orderId);
} else {
that.AddToExistingRequisition(matchingObj, orderNode, orderId, orderMetadata);
}
//Creating the context menu for order node
zCreateOrderContextMenu();
callback();
return '#' + orderId;
};
this.AddRequisition = function (options, orderNode, orderId) {
try {
var reqUniqueId = ++m_uniqueReqId; // Using global vriable that stores the latest requisition id to use on add
var reqId = 'requsition_' + reqUniqueId;
var reqMetadata = {
"orderTypeId" : options.orderTypeId,
"Diagnoses": options.Diagnoses,
"FacilityId" : options.FacilityId == undefined ? '' : options.FacilityId,
"FacilityName" : options.FacilityName == undefined ? '' : options.FacilityName,
"DueDate" : options.DueDate == undefined ? '' : options.DueDate,
"PriorityId" : options.PriorityId == undefined ? '' : options.PriorityId,
"PriorityName" : options.PriorityName == undefined ? '' : options.PriorityName,
"FastingId" : options.FastingId == undefined ? '' : options.FastingId,
"FastingName" : options.FastingName == undefined ? '' : options.FastingName,
"ContrastId" : options.ContrastId == undefined ? '' : options.ContrastId,
"ContrastName" : options.ContrastName == undefined ? '' : options.ContrastName,
"SpecialInstructions" : options.SpecialInstructions == undefined ? '' : options.SpecialInstructions
};
var reqClass = 'someclass';
var reqNode = { "title" : options.title, "state": "open", "li_attr" : { "id" : reqId, "class" : "requisition" + reqClass, "metadata" : JSON.stringify(reqMetadata) }, "data" : { } };
var parentNode = -1;
var requisitionNode = -1;
var addClass = '';
setTimeout(function() {
that.$container.jstree("create_node", parentNode, reqNode, "last", function () {
// Set up subnodes
setTimeout(function() {
var facility = reqMetadata.FacilityName == '' ? 'Facility' : 'Facility: ' + reqMetadata.FacilityName;
addClass = reqMetadata.FacilityName == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + reqId), { "title" : facility, "state": "closed", "li_attr" : { "id" : reqId + '_facility', "class" : "facility" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 5);
setTimeout(function() {
var dueDate = reqMetadata.DueDate == '' ? 'Due Date' : 'Due Date: ' + reqMetadata.DueDate;
addClass = reqMetadata.DueDate == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + reqId), { "title" : dueDate, "state": "closed", "li_attr" : { "id" : reqId + '_duedate', "class" : "duedate" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 5);
setTimeout(function() {
var priority = reqMetadata.PriorityName == '' ? 'Priority' : 'Priority: ' + reqMetadata.PriorityName;
addClass = reqMetadata.PriorityName == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + reqId), { "title" : priority, "state": "closed", "li_attr" : { "id" : reqId + '_priority', "class" : "priority" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 5);
if (reqMetadata.orderTypeId == 1 ) {
setTimeout(function() {
var fasting = reqMetadata.FastingName == '' ? 'Fasting' : 'Fasting: ' + reqMetadata.FastingName;
addClass = reqMetadata.FastingName == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + reqId), { "title" : fasting, "state": "closed", "li_attr" : { "id" : reqId + '_fasting', "class" : "fasting" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 5);
}
setTimeout(function() {
var specialInstructions = reqMetadata.SpecialInstructions == '' ? 'Special Instructions' : 'Special Instructions: ' + reqMetadata.SpecialInstructions;
that.$container.jstree("create_node", $('#' + reqId), { "title" : specialInstructions, "state": "closed", "li_attr" : { "id" : reqId + '_specialinstructions', "class" : "specialinstructions" }, "metadata" : {}, "data" : { } }, "last");
}, 5);
setTimeout(function() {
that.$container.jstree("create_node", $('#' + reqId), { "title" : "Orders", "state": "open", "li_attr" : { "id" : reqId + '_orders', "class" : "orders" + reqClass }, "metadata" : {}, "data" : { } }, "last", function() {
if (orderNode) {
setTimeout(function() {
that.$container.jstree("create_node", $('#' + reqId + '_orders'), orderNode, "last",
function() {
// Set up subnodes
setTimeout(function() {
var diagnoses = reqMetadata.Diagnoses.names == '' ? 'Diagnoses' : 'Diagnoses: ' + reqMetadata.Diagnoses.names;
addClass = reqMetadata.Diagnoses.names == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + orderId), { "title" : diagnoses, "state": "closed", "li_attr" : { "id" : orderId + '_diagnoses', "class" : "diagnoses" + addClass, "title": "Diagnoses: " + options.Diagnoses.names }, "metadata" : {}, "data" : { } }, "last");
}, 2);
setTimeout(function() {
var facility = reqMetadata.FacilityName == '' ? 'Facility' : 'Facility: ' + reqMetadata.FacilityName;
addClass = reqMetadata.FacilityName == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + orderId), { "title" : facility, "state": "closed", "li_attr" : { "id" : orderId + '_facility', "class" : "facility" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 2);
setTimeout(function() {
var dueDate = reqMetadata.DueDate == '' ? 'Due Date' : 'Due Date: ' + reqMetadata.DueDate;
addClass = reqMetadata.DueDate == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + orderId), { "title" : dueDate, "state": "closed", "li_attr" : { "id" : orderId + '_duedate', "class" : "duedate" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 2);
setTimeout(function() {
var priority = reqMetadata.PriorityName == '' ? 'Priority' : 'Priority: ' + reqMetadata.PriorityName;
addClass = reqMetadata.PriorityName == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + orderId), { "title" : priority, "state": "closed", "li_attr" : { "id" : orderId + '_priority', "class" : "priority" + addClass }, "metadata" : {}, "data" : { } }, "last");
}, 2);
// ONLY for LAB
if (reqMetadata.orderTypeId == 1 ) {
setTimeout(function() {
var fasting = reqMetadata.FastingName == '' ? 'Fasting' : 'Fasting: ' + reqMetadata.FastingName;
addClass = reqMetadata.FastingName == '' ? ' invalid' : '';
that.$container.jstree("create_node", $('#' + orderId), { "title": fasting, "state": "closed", "li_attr": { "id": orderId + '_fasting', "class": "fasting" + addClass }, "metadata": { }, "data": { } }, "last");
}, 2);
}
setTimeout(function() {
var specialInstructions = reqMetadata.SpecialInstructions == '' ? 'Special Instructions' : 'Special Instructions: ' + reqMetadata.SpecialInstructions;
that.$container.jstree("create_node", $('#' + orderId), { "title" : specialInstructions, "state": "closed", "li_attr" : { "id" : orderId + '_specialinstructions', "class" : "specialinstructions" }, "metadata" : {}, "data" : { } }, "last");
}, 2);
});
}, 200);
}
setTimeout(function() {
that.$container.jstree("delete_node", '#jstree_waitingfororders');
}, 2);
});
}, 5);
});
}, 5);
return '#' + reqId;
}