动态无限级关联下拉菜单

易博文
2023-12-01
jowing 演示地址: http://www.whcgch.com/persionalweb/jowing/js/ilist/ItemAdd.asp

主要是用XMLDOM执行一个ASP程序返回一个结点XML,客户端提交后用USERDATA对像保留用户当前数据(仅仅指关联下拉菜单)。


JS程序:

function BuildList(){
   var NodeID;
   
   //获出节点//
   if (event.srcElement){
      NodeID=event.srcElement.value;
   }else{
      NodeID=0;
   }

   //获取缓存//
   var listData=document.getElementById("List")
   listData.load("myCache");
   cacheData=listData.getAttribute("listInnerHtml")
   var listValue=listData.getAttribute("listValue")

   //缓存载入判断//   
   if (NodeID==0 && cacheData!=null){
      form1.NodeID.value=listValue;
      document.getElementById("List").innerHTML=cacheData;
      for(var j=0;j             var listObj=document.all.tags("select")[j];
               listObj.attachEvent("onchange",function(){BuildList()});
      };
   }else{
      if (NodeID!=null){
         var nodeLength;
                var listObj;
             var listItem;
             var nodeObj;
             var myErr;
             var i=0;
               var j=0;
             var listIndex=0;
             var listCount;

         //清空缓存//
        var listData=document.getElementById("List")
             if(listData.getAttribute("listInnerHtml")!=null){
               listData.removeAttribute("listInnerHtml");
            listData.save("myCache");   
         }
                
         //赋值//
             document.getElementById("NodeID").value=NodeID;
             listCount=document.all.tags("select").length

         //读取子栏目数据//
         var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
         xmlDoc.async = false;
         xmlDoc.load("getNodeXml.asp?NodeID="+ NodeID +"");
         if (xmlDoc.parseError.errorCode != 0) {
            myErr = xmlDoc.parseError;
            alert("XML载入失败!" + myErr.reason);
         } else {
            nodeObj=xmlDoc.getElementsByTagName("Node");
            nodeLength=nodeObj.length;
            currNode = xmlDoc.documentElement.childNodes.item(0);
         };

         //获取当前下拉列表索引值//
         for(listIndex=0;listIndex<=listCount;listIndex++){
                  if (document.all.tags("select")[listIndex]==event.srcElement){
                       break;
                    };
             };
      
             //列表移除//
         if (listIndex+1<=listCount){
            for (j=listCount-1;j>listIndex;j--){
               document.all.tags("select")[j].removeNode(true);          
                };
         };
               
             //列表建立//
             if (nodeLength!=0){
            listObj = document.createElement("select")
            listObj.attachEvent("onchange",function(){BuildList()});
            listObj.options[listObj.options.length++] = new Option("所属栏目","");
                  for (i=0;i               listObj.options[listObj.options.length++] = new Option(nodeObj.item(i).childNodes[1].text,nodeObj.item(i).childNodes[0].text);
                };
            List.appendChild(listObj);  
         };
      };
   };
};

function SaveCache(){
   //设置缓存过期时间//
    var oTimeNow = new Date();
   oTimeNow.setMinutes(oTimeNow.getMinutes() + 1);
   var sExpirationDate = oTimeNow.toUTCString();
   
  var listData=document.getElementById("List")  
   listData.expires=sExpirationDate;
   listData.setAttribute("listInnerHtml",listData.innerHTML);
   listData.setAttribute("listValue",form1.NodeID.value)
   listData.save("myCache");   
};

获取XML数据ASP程序:


使用方法

< META content=history name=save>

< LINK href="css.css" type=text/css rel=stylesheet>

< SPAN class=userData id=List>< /SPAN>



另外数据库结构如下:
NodeID           indentinity
NodeName      varchar
BelongNodeID  int

 
 类似资料: