이번에는 비동기 프로세스 중 jQuery zTree의 하위 노드 반복 추가에 대해 알려드리겠습니다. 살펴보자.
zTree
zTree는 jQuery로 구현된 다기능 "트리 플러그인"입니다. 뛰어난 성능, 유연한 구성, 다양한 기능의 결합은 zTree의 가장 큰 장점입니다. zTree는 오픈 소스 및 무료 소프트웨어(MIT 라이센스)입니다. zTree에 관심이 있거나 zTree의 지속적인 개발에 자금을 지원하고 싶다면 기부할 수 있습니다.
zTree v3.0은 기능에 따라 핵심 코드를 나누어 불필요한 코드를 로드할 필요가 없습니다.
정적
이벤트
//添加结点, 产品和版本
function addNode(event) {
rMenu.css({ "visibility": "hidden" });
var treeNode = zTree.getSelectedNodes()[0];
var pid;
var nodeName;
var treelevel;
if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) {
//添加产品结点
pid = 0;
treeNode = null;
treelevel = 1;
} else if (treeNode) {
//添加版本结点
pid = treeNode.id;
treelevel = 2;
}
$.post(
"AddNode.action",
{ type: treelevel, id: pid },
function(nodeIdAndName) {
var params = /([^\|]+)\|([^\|]+)/.exec(nodeIdAndName);
if (!((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.open)) {
zTree.expandNode(treeNode, true);
}
treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel });
});
}
방법 1
윌 if (!((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.open)) {
zTree.expandNode(treeNode, true);
}
treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel });
if(!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) { treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); } else if(treeNode.open) { if(treeNode.isParent) { zTree.reAsyncChildNodes(treeNode, "refresh"); } else { treeNode.isParent=true; zTree.reAsyncChildNodes(treeNode, "refresh"); } } else { zTree.expandNode(treeNode, true); treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); }
로 변경 문제는 해결될 수 있지만 최적화가 있습니까? 변경 후 코드 카테고리가 너무 많아진 것 같아요
가장 좋은 방법
그다지 번거롭지는 않은 것 같죠? 이틀 전에도 비슷한 질문에 답했습니다. 1. 하위 노드를 추가하기 위해 클릭한 후, 데이터를 저장하고 성공 이벤트를 캡처하기 위해 배경으로 직접 ajax합니다
2. ajax가 성공하면 treeNode.zAsync 속성을 사용하여 상위 노드가 비동기적으로 로드되었는지 확인할 수 있습니다. false인 경우 reAsyncChildNodes가 직접 새로 고쳐집니다. 그러면 addN...
if ((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.zAsync) treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); else zTree.reAsyncChildNodes(treeNode, "refresh");
I을 사용하세요. 이 기사의 사례를 읽으셨다면, 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주의 깊게 살펴보시기 바랍니다.
추천 자료:
jquery로 웹팩을 구성하는 방법jQuery EasyUI 작업 접이식 패널 아코디언 세부 단계
jQuery 작업 목록 군인들이 동적으로 새 요소를 추가합니다
위 내용은 jQuery zTree는 비동기 프로세스 중에 하위 노드를 반복적으로 추가합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!