很恼人的JavaScript树添加节点问题,重分求解!(100分)

  • 主题发起人 主题发起人 YFeral
  • 开始时间 开始时间
Y

YFeral

Unregistered / Unconfirmed
GUEST, unregistred user!
我目前用了一颗JavaScript树,这个树有这么一个bug,就是在这个树建立完之后如果在调用addNode(...)函数添加一级,二级节点(从1级算起,没有0级),就报treeFrame.nodeText_xx不是对象的错误,看了看是addNode(...)的错误,那位仁兄能帮我一把? 定当重谢!分不够还可再发.
下面是相关的代码.
ChristmasTree.js:
//Show string in HTML
function formatString(inputString)
{
returnString=inputString.replace(/&/g, "&" )
.replace(/</g, "&amp;lt;" )
.replace(/>/g, "&amp;gt;" )
.replace(/ /g, "&amp;nbsp;")
.replace(//r/n/g,"<BR>" )
.replace(//n/r/g,"<BR>" )
.replace(//n/g, "&amp;#10;" )
.replace(//r/g, "&amp;#13;" )
.replace(/'/g, "&amp;#39;" )
.replace(/"/g, "&amp;#34;" )
.replace(//+/g, "&amp;#43;" );
return returnString;
}
//Define Image Object
function imageObject(type,width,height,image,openImage,selectImage)
{
this.type=type;
this.width=width;
this.height=height;
this.image=image;
this.openImage=openImage;
this.selectImage=selectImage;
}
//Remember the Type Icon
function addImage(type,width,height,normalImage,openImage,selectImage)
{
var i;
if (!openImage)
openImage=normalImage;
if (!selectImage)
selectImage=false;
for (i=0;i<imageLib.length;i++)
{
if (imageLib.type==type)
break;
}
imageLib=new imageObject(type,width,height,normalImage,openImage,selectImage);
}
//Read the Type Icon
function getImage(type)
{
var i;
for (i=0;i<imageLib.length;i++)
if (imageLib.type==type)
return imageLib
return imageLib[0];
}
//Define the Node Object
function nodeObject(parentId,nodeId,type,text,url,memo)
{
this.nodeId=nodeId;
this.type=type;
this.text=text;
this.url=url;
this.memo=memo;
this.isOpened=false;
this.parentId=parentId;
this.isRemoved=false;
this.childrenId=new Array(0);
}
//Whether the Node the last child of its parent
function isLastChild(nodeId)
{
if ((nodeId<0)||(treeNodes[nodeId].parentId<0)||(treeNodes[treeNodes[nodeId].parentId].childrenId[treeNodes[treeNodes[nodeId].parentId].childrenId.length-1]==nodeId))
return true;
else
return false;
}
//To get the images HTML which will use before the Node
function getPrevHTML(nodeId)
{
if (nodeId>0)
{
if (treeNodes[nodeId].parentId>0)
{
if (isLastChild(treeNodes[nodeId].parentId))
return getPrevHTML(treeNodes[nodeId].parentId)+"<img align=top src='"+imagePath+"blank.gif'>";
else
return getPrevHTML(treeNodes[nodeId].parentId)+"<img align=top src='"+imagePath+"line.gif'>";
}
else
return ""
}
else
return ""
}
//To get the Connect image
function getLineImage(nodeId)
{
if (treeNodes[nodeId].childrenId.length>0)
{
if (isLastChild(nodeId))
{
if (treeNodes[nodeId].isOpened)
return imagePath+"minusbottom.gif";
else
return imagePath+"plusbottom.gif";
}
else
{
if (treeNodes[nodeId].isOpened)
return imagePath+"minus.gif";
else
return imagePath+"plus.gif";
}
}
else
{
if (isLastChild(nodeId))
return imagePath+"joinbottom.gif";
else
return imagePath+"join.gif";
}
}
//To get the HTML of the subtree
function showTree(nodeId)
{
var i,prevHTML,lineImage,typeImage,imageFile,treeHTML="",typeString;
prevHTML=getPrevHTML(nodeId);
lineImage="<img id=lineImg_"+nodeId+" src='"+getLineImage(nodeId)+"' align=top onclick='controlFrame.clickLine("+nodeId+")'>";
if (nodeId==0)
lineImage=""
typeImage=getImage(treeNodes[nodeId].type);
if (treeNodes[nodeId].isOpened)
imageFile=typeImage.openImage;
else
imageFile=typeImage.image;
typeString=treeNodes[nodeId].type
if (nodeId==selectedNodeId)
typeString="SelectedNode"
treeHTML+="<div id=node_"+nodeId+"><div id=nodeEntry_"+nodeId+" class="+typeString+"Entry><nobr>"+prevHTML+lineImage+"<span title='"+formatString(treeNodes[nodeId].memo)+"' onclick=controlFrame.selectNode("+nodeId+") ondblclick='if (controlFrame.onDblClickNode("+nodeId+")) controlFrame.clickLine("+nodeId+")'><img id=typeImg_"+nodeId+" src='"+imageFile+"' align=top border=0 width="+typeImage.width+" height="+typeImage.height+"><span id=nodeText_"+nodeId+" class="+typeString+">"+formatString(treeNodes[nodeId].text)+"</span></span></nobr></div>";
if (treeNodes[nodeId].childrenId.length>0)
{
if (treeNodes[nodeId].isOpened)
treeHTML+="<div id=children_"+nodeId+">"
else
treeHTML+="<div id=children_"+nodeId+" style='display:none'>"
for(i=0;i<treeNodes[nodeId].childrenId.length;i++)
treeHTML+=showTree(treeNodes[nodeId].childrenId)
treeHTML+="</div>"
}
treeHTML+="</div>"
return treeHTML
}
//To drar the tree
function drawTree(treeFrame,targetFrame)
{
window.treeFrame=treeFrame;
window.targetFrame=targetFrame;
window.treeFrame.controlFrame=window;
if (treeNodes.length>0)
treeFrame.document.write(showTree(0))
}
//To refresh the tree
function refreshTree()
{
window.treeFrame.location.reload();
}
function refreshNode(nodeId)
{
//eval("treeFrame.node_"+nodeId+".outerHTML=showTree("+nodeId+")")
//modify by ywf.
eval("window.treeFrame.node_"+nodeId+".outerHTML=showTree("+nodeId+")");
}
//************************************bug is here!***********************
//To add a Node to the Tree
function addNode(parentId,type,text,url,memo)
{
var nodeId=treeNodes.length;
if (onAddNode(parentId,type,text,url,memo))
{
if (!url)
url="";
if (!memo)
memo="";
treeNodes[nodeId]=new nodeObject(parentId,nodeId,type,text,url,memo);
if (parentId>=0)
{
treeNodes[parentId].childrenId[treeNodes[parentId].childrenId.length]=nodeId;
}
if (window.treeFrame)
{
if (autoRefresh)
{
refreshNode(parentId);
}
}
return nodeId;
}
else
return -1;
}
//************************************the above is bug!***********************
//To Remove the Node and its children from the tree
function deleteNode(nodeId)
{
var i;
for (i=0;i<treeNodes[nodeId].childrenId.length;i++)
deleteNode(treeNodes[nodeId].childrenId);
treeNodes[nodeId].isRemoved=true;
}
function removeNode(nodeId)
{
var i,childIndex,lastChild;
selectNode(-1)
if (nodeId<1)
return false
if (treeNodes[nodeId].isRemoved)
return false
if ((treeNodes[nodeId].parentId>=0)&amp;&amp;(onRemoveNode(nodeId)))
{
lastChild=isLastChild(nodeId);
for (i=0;i<treeNodes[treeNodes[nodeId].parentId].childrenId.length;i++)
if (treeNodes[treeNodes[nodeId].parentId].childrenId==nodeId)
childIndex=i
for (i=childIndex;i<treeNodes[treeNodes[nodeId].parentId].childrenId.length-1;i++)
treeNodes[treeNodes[nodeId].parentId].childrenId=treeNodes[treeNodes[nodeId].parentId].childrenId[i+1];
treeNodes[treeNodes[nodeId].parentId].childrenId.length--;
deleteNode(nodeId)
if (window.treeFrame)
{
if (autoRefresh)
{
eval("treeFrame.node_"+nodeId+".outerHTML=''")
if (eval("treeFrame.children_"+nodeId))
eval("treeFrame.children_"+nodeId+".outerHTML=''")
if (lastChild)
{
if (childIndex>0)
refreshNode(treeNodes[treeNodes[nodeId].parentId].childrenId[childIndex-1])
else
{
eval("treeFrame.children_"+treeNodes[nodeId].parentId+".outerHTML=''")
if (treeNodes[nodeId].parentId>0)
eval("treeFrame.lineImg_"+treeNodes[nodeId].parentId+".src='"+getLineImage(treeNodes[nodeId].parentId)+"'")
}
}
}
}
}
}
//To move the Node and its Children to a new Parent
function moveNode(nodeId,parentId)
{
var badParent=false;
var newParentId=parentId
if (parentId==treeNodes[nodeId].parentId)
return;
while (parentId>=0)
{
if (parentId==nodeId)
badParent=true
parentId=treeNodes[parentId].parentId;
}
if ((!badParent)&amp;&amp;(onMoveNode(nodeId,parentId)))
{
removeNode(nodeId)
treeNodes[newParentId].childrenId[treeNodes[newParentId].childrenId.length]=nodeId;
treeNodes[nodeId].parentId=newParentId
if (window.treeFrame)
if (autoRefresh)
refreshNode(newParentId)
}
}
//To open a Tree Node
function openNode(nodeId)
{
if (treeNodes[nodeId].childrenId.length>0)
if ((!treeNodes[nodeId].isOpened)&amp;&amp;(onOpenNode(nodeId)))
{
treeNodes[nodeId].isOpened=true;
if (window.treeFrame)
{
if (autoRefresh)
{
eval("treeFrame.children_"+nodeId+".style.display=''")
if (nodeId>0)
eval("treeFrame.lineImg_"+nodeId+".src='"+getLineImage(nodeId)+"'")
if ((nodeId==selectedNodeId)&amp;&amp;(getImage(treeNodes[selectedNodeId].type).selectImage))
eval("treeFrame.typeImg_"+selectedNodeId+".src='"+getImage(treeNodes[selectedNodeId].type).selectImage+"'")
else

eval("treeFrame.typeImg_"+nodeId+".src='"+getImage(treeNodes[nodeId].type).openImage+"'")
}
}
onAfterOpenNode(nodeId)
}

}
//To Close a Tree Node
function closeNode(nodeId)
{
if ((treeNodes[nodeId].isOpened)&amp;&amp;(onCloseNode(nodeId)))
{
treeNodes[nodeId].isOpened=false;
if (autoRefresh)
{
eval("treeFrame.children_"+nodeId+".style.display='none'")
if (nodeId>0)
eval("treeFrame.lineImg_"+nodeId+".src='"+getLineImage(nodeId)+"'")
if ((nodeId==selectedNodeId)&amp;&amp;(getImage(treeNodes[selectedNodeId].type).selectImage))
eval("treeFrame.typeImg_"+selectedNodeId+".src='"+getImage(treeNodes[selectedNodeId].type).selectImage+"'")
else

eval("treeFrame.typeImg_"+nodeId+".src='"+getImage(treeNodes[nodeId].type).image+"'")
}
}
}
//To open the tree from Root to the Node
function openToNode(nodeId)
{
while(nodeId>0)
{
nodeId=treeNodes[nodeId].parentId
openNode(nodeId);
}
}
//To open all the children of the Tree
function openAllNode(nodeId)
{
var i;
if (!nodeId)
nodeId=0
openNode(nodeId)
for(i=0;i<treeNodes[nodeId].childrenId.length;i++)
openAllNode(treeNodes[nodeId].childrenId)
}
//To Close all the children of the Node
function closeAllNode(nodeId)
{
var i;
if (!nodeId)
nodeId=0
closeNode(nodeId)
for(i=0;i<treeNodes[nodeId].childrenId.length;i++)
closeNode(treeNodes[nodeId].childrenId)
}
//Call the function when click the line icon before the Node
function clickLine(nodeId)
{
var lineImage;
if (treeNodes[nodeId].isOpened)
closeNode(nodeId)
else
openNode(nodeId)
}
//To Select a Node
function selectNode(nodeId)
{
if (onSelectNode(nodeId))
{
if (window.treeFrame)
{
if (selectedNodeId>=0)
{
if (selectedNodeId!=nodeId)
{
eval("treeFrame.nodeText_"+selectedNodeId+".className='"+treeNodes[selectedNodeId].type+"'")
eval("treeFrame.nodeEntry_"+selectedNodeId+".className='"+treeNodes[selectedNodeId].type+"Entry'")
}
if (treeNodes[selectedNodeId].isOpened)
eval("treeFrame.typeImg_"+selectedNodeId+".src='"+getImage(treeNodes[selectedNodeId].type).openImage+"'")
else
eval("treeFrame.typeImg_"+selectedNodeId+".src='"+getImage(treeNodes[selectedNodeId].type).image+"'")
}
selectedNodeId=nodeId
if (selectedNodeId>=0)
{
eval("treeFrame.nodeText_"+selectedNodeId+".className='selectedNode'")
eval("treeFrame.nodeEntry_"+selectedNodeId+".className='selectedNodeEntry'")
if (getImage(treeNodes[selectedNodeId].type).selectImage)
eval("treeFrame.typeImg_"+selectedNodeId+".src='"+getImage(treeNodes[selectedNodeId].type).selectImage+"'")
if ((treeNodes[nodeId].url)&amp;&amp;(onOpenUrl(nodeId)))
targetFrame.location.href=treeNodes[nodeId].url
}

}
selectedNodeId=nodeId
}
}
//To set the Text of a Node
function setNodeText(nodeId,text)
{
treeNodes[nodeId].text=text;
if (autoRefresh)
eval("treeFrame.nodeText_"+nodeId+".innerHTML=formatString(text)");
}
function getNodeText(nodeId)
{
return treeNodes[nodeId].text;
}
//To set the Type of a Node
function setNodeType(nodeId,type)
{
treeNodes[nodeId].type=type;
if (autoRefresh)
{
if ((nodeId==selectedNodeId)&amp;&amp;(getImage(treeNodes[selectedNodeId].type).selectImage))
eval("treeFrame.typeImg_"+selectedNodeId+".src='"+getImage(treeNodes[selectedNodeId].type).selectImage+"'")
else
if (treeNodes[nodeId].isOpened)
eval("treeFrame.typeImg_"+nodeId+".src='"+getImage(treeNodes[nodeId].type).openImage+"'")
else
eval("treeFrame.typeImg_"+nodeId+".src='"+getImage(treeNodes[nodeId].type).image+"'")
eval("treeFrame.typeImg_"+nodeId+".width='"+getImage(treeNodes[nodeId].type).width+"'")
eval("treeFrame.typeImg_"+nodeId+".height='"+getImage(treeNodes[nodeId].type).height+"'")
}
}
function getNodeType(nodeId)
{
return treeNodes[nodeId].type;
}
//To set the URL of a Node
function setNodeUrl(nodeId,url)
{
treeNodes[nodeId].url=url;
}

function getNodeUrl(nodeId)
{
return treeNodes[nodeId].url;
}
//To set the Memo of a Node
function setNodeMemo(nodeId,memo)
{
treeNodes[nodeId].memo=memo;
if (autoRefresh)
eval("treeFrame.nodeText_"+nodeId+".title=memo");
}
function getNodeMemo(nodeId)
{
return treeNodes[nodeId].memo;
}
//Get first child
function getFirstChild(nodeId)
{
var childId=-1;
if ((nodeId>=0)||(treeNodes[nodeId].childrenId.length>0))
childId=treeNodes[nodeId].childrenId[0]
return childId;
}
//Get last child
function getLastChild(nodeId)
{
var childId=-1;
if ((nodeId>=0)||(treeNodes[nodeId].childrenId.length>0))
childId=treeNodes[nodeId].childrenId[treeNodes[nodeId].childrenId.length-1]
return childId;
}
//Find brother
function getBrotherOrder(nodeId)
{
var i,childIndex=-1;
if (nodeId<1)
return -1
for (i=0;i<treeNodes[treeNodes[nodeId].parentId].childrenId.length;i++)
if (treeNodes[treeNodes[nodeId].parentId].childrenId==nodeId)
childIndex=i
return childIndex
}
function getPrevBrother(nodeId)
{
var childIndex=-1
childIndex=getBrotherOrder(nodeId)
if (childIndex<0)
return -1
childIndex--
if (childIndex<0)
return -1
return treeNodes[treeNodes[nodeId].parentId].childrenId[childIndex]
}
function getNextBrother(nodeId)
{
var childIndex=-1
childIndex=getBrotherOrder(nodeId)
if (childIndex<0)
return -1
childIndex++
if (childIndex>=treeNodes[treeNodes[nodeId].parentId].childrenId.length)
return -1
return treeNodes[treeNodes[nodeId].parentId].childrenId[childIndex]
}
// Event functions
//trig when select a node
function onSelectNode(nodeId)
{
return true
}
//trig whendo
uble click a node
function onDblClickNode(nodeId)
{
return true
}
//trig when open a Node
function onOpenNode(nodeId)
{
return true
}
function onAfterOpenNode(nodeId)
{
return true
}
function onOpenUrl(nodeId)
{
return true
}
//trig when close a Node
function onCloseNode(nodeId)
{
return true
}
//trig when add a Node
function onAddNode(parentId,type,text,url,memo)
{
return true
}
//trig when remove a Node
function onRemoveNode(nodeId)
{
return true
}
//trig when move a node
function onMoveNode(nodeId,parentId)
{
return true
}
//Other Function
function getImagePath()
{
if ((window.christmasTree)&amp;&amp;(window.christmasTree.imagePath))
return window.christmasTree.imagePath
else
return ""
}
//get parentText;
function getSelPNodeText(NodeId)
{
var id = getSelParentId(NodeId);
var text = getNodeText(id);
return text;
}
//Get parentId of selectedNode add by ywf.
function getSelParentId(NodeId)
{
return treeNodes[NodeId].parentId;
}
//Delete selected node add by ywf.
function delse
lected()
{
//get brother node of it.
var id = getNextBrother(selectedNodeId);
if(id == -1)
{
id = getPrevBrother(selectedNodeId);
if(id == -1)
id = treeNodes[selectedNodeId].parentId;
}
removeNode(selectedNodeId);
//select it's brother.
selectNode(id);
refreshNode(id);
}
//judge a selnode whether has child node.
function SelnodeHasChnode()
{
if(treeNodes[selectedNodeId].childrenId.length <= 0)
return false;
else
return true;
}

//add childnode on selnode's parent, add by ywf。
function addOnSelParent(Type, Text, Url, Mem)
{
var id = addNode(getSelParentId(selectedNodeId), Type, Text, Url, Mem);
selectNode(id);
}
//set selnode's caption . add by ywf.
function setSelNodeText(text)
{
setNodeText(selectedNodeId,text)
}
//add childnode on selnode. add by ywf.
function addChildNodeOnSel(type, text, url, mem)
{
var i = addNode(selectedNodeId, type, text, url, mem);
openNode(selectedNodeId);
selectNode(i);
}
//get selnod's caption. add by ywf.
function getSelNodeText(text)
{
return getNodeText(selectedNodeId);
}
//add class
function addClass(url, text)
{
var id = addNode(node_0, url, text, '');
openNode(id);
selectNode(id);
}

//get selected node id.
function getSelectedId()
{
return selectedNodeId;
}
// Global Variant
var imageLib=new Array(0);
var treeNodes=new Array(0);
var selectedNodeId=-1;
var autoRefresh=true
var treeFrame,targetFrame;
var imagePath=getImagePath();
//addImage("empty",0,0,"empty.gif")
/*******************************************************
File Name:ChristmasTree.js
Main Function:To Control a JavaScript Tree
Last Modified Data:Dec 22nd,1999
Written by:Cai Xinqi-2324
*******************************************************/

//主框架的代码, 用于显示树.(它的左框架是JavaScript树,右边是树显示的内容)
default.htm

<html><title>技术支持与维护经验专家库系统</title>
<FRAMESET name="fram" id=fsTop style="BEHAVIOR: url(panebar.htm)" MARGINWIDTH="0" MARGINHEIGHT="0" LEFTMARGIN="0" TOPMARGIN="0" FRAMESPACING="0" BORDER="1" rows="85,441*" cols="*" bordercolor="">
<FRAME MARGINWIDTH="0" MARGINHEIGHT="0" LEFTMARGIN="0" TOPMARGIN="0" BORDER="0" FRAMEBORDER="0" SCROLLING="no" NORESIZE="false" SRC="top.htm" NAME="fraPaneBar" PADDING="0" noresize>
<FRAMESET id=TCfs MARGINWIDTH="0" MARGINHEIGHT="0" LEFTMARGIN="0" TOPMARGIN="0" FRAMESPACING="4" BORDER="1" FRAMEBORDER="1" cols="170,*" bordercolor="" rows="*">
<frame name=tree src=neDictTree.htm resize>
<frame name=content src=empty.htm>
</frameset>
</frameset>
<html></html>

///************************************************************
//添加JavaScript节点的页面, neDictTree.htm
<html>
<title></title>
<script id=christmasTree imagePath=images_os2/ language=javascript src="./include/ChristmasTree.js"></script>
</head>
<body background="../image/tmn.gif">

<script language=javascript>
//Add use text
function addAttr(pId, URL, Text)
{
eval(pId + 1 + "=addNode(" + pId + ", 'Page', Text, URL, '')");
// openNode(eval("nodelthree_" + parentId + 1));
// openNode(pStr + pId + 1);
selectNode(pStr + pId + 1);
}
//get caption of parent node of selnod.
function getSelectPCaption()
{
var x=getSelectedId();
var y= getSelPNodeText(x);
return y;
}
//test progra
function test()
{
var id;
selectNode(addNode(node_l, 'Book', 'test', '', ''));
//drawTree(window, parent.neTypeCon)
//parent.window.neTypeTree.openNode(id);
//selectNode(id);
//alert(getSelectedId());
//selectNode(id);
}
function judge()
{
if(SelnodeHasChnode())
{
alert("has child node, can't delete!");
}
}
addImage('Book',18,16,'Icons/bookclosed.gif','Icons/bookopen.gif','')
addImage('ff',18,16,'Icons/folderclosed.gif','Icons/folderopen.gif')
addImage('Page',18,16,'Icons/Files.GIF','Icons/Files.GIF','Icons/filesselected.GIF')
addImage('P1',18,16,'Icons/ball10.gif','Icons/ball10.gif','Icons/ball12.gif')
//first.
node_0=addNode(-1,'Book','system','empty.htm','')
//second
node_l = addNode(0, 'Book', 'one', '','');
//three.
node_3 = addNode(node_l, 'Book', 'two', '', '');
openNode(node_0);
openNode(nodelone_0);
//openNode(nodeltwo_0);
</script>
<body bgcolor="#E4EBF3" text="#000000" leftmargin="0" topmargin="0">
<!--<body background=../images/cheeloosoft.gif onselectstart='event.returnValue=0' >-->
<style>
.ChristmasTree
{
font-size:9pt;
cursor:default;
}
.SelectedNode
{
background-color:#000080;
color:#ffffff;
text-decoration:Underline
}
.Page
{
color:#0000ff
}
</style>
<div>
<table>
<tr><td><small>????????</small></td></tr>
<tr><td>
<form><input type="button" onClick=" parent.neTypeTree.test('ff', 'tttt', '', '')" value="test"></form>
</td></tr>
</table>
</div>
<div class=ChristmasTree style='font-size:10pt;'>
<script language="javascript">
var controlframe
drawTree(window, parent.neTypeCon)
</script>
</div>
<table height="100">
<tr>
<td>
<iframe src="scroll.htm" width="100%" height="80" scrolling="no" frameborder="0"></iframe>
</td>
</tr>
</table>
</body></html>

//**********************************************
一点说明, default.htm是主框架(frame),neDictTree.htm是Tree框架(default.htm里有
描述)的子框架,ChristmasTree.js是JavaScript树的定义脚本。
//*******************************************
希望能在12月30日12:00之前求解,本人一直在线,还请各位高手多多指教!搞不定我可要失业了,唉!
 
我自己已经搞定了!
 
代码太长了。差点把我弄死机了。
 
后退
顶部