fieldset可伸缩JS实现

/***************************************************
@DESC ： 加工fieldset（默认class='fieldsetCss'可伸缩）
@author : wuqing
@date : 2012-01-15
@remark :
   1、onShowEvent：显示触发事件
   2、onHideEvent：隐藏触发事件
   3、fieldset添加show和hide事件,JS可以直接调用控制收缩还是展开
   4、html页面代码：
    <fieldset class="fieldsetCss" align='center' onShowEvent="" onHideEvent="">
   <legend>标题</legend> 
    <div>内容</div>
  </fieldset>
****************************************************/
function initFlowFieldSet(className){
    if(className == undefined || className == ''){
     className = 'fieldsetCss';
    }
 var fieldSetArr = $("."+className);// class=className的fieldset对象数组
 for(var i=0; i<fieldSetArr.length; i++){
  var fieldSetObj = fieldSetArr[i];
  fieldSetObj.insertAdjacentHTML("beforeEnd","<div title='展开' id='fieldSetDiv_"+fieldSetObj.uniqueID+"' οnmοuseοver='this.style.color=\"red\"' οnmοuseοut=this.style.color=\"#4068AA\" style='display:none;margin-top:0px;font:15px;maring-bottom:5px;cursor:hand;color:#4068AA;' class='fieldSetHiddenCss' align='center'>······</div>");
  var fieldSetChildren = fieldSetObj.children;
  for(var j=0; j<fieldSetChildren.length; j++){
   var child = fieldSetChildren[j];
   
   if(child.nodeName == 'DIV' && child.className == 'fieldSetHiddenCss'){// 收缩时展示区域的点击事件
    child.onclick = function(){
        this.parentElement.show();// 触发显示事件
     this.style.display == 'none';// 该区域隐藏
    }
   }
   
   if(child.nodeName == 'LEGEND'){// 对legend标签进行加工处理
       var innerHtml = '<font style="font-family: Webdings;">6</font>';
    var fontColor = child.style.color;
    child.innerHTML = innerHtml + "<span style='font-size:14px;font-weight:bold;cursor:hand;'>" +child.innerHTML + "</span>";
    child.title = "点击‘收缩/展开’";
    
    // legend的点击事件
    child.onclick = function(){
     var fontObj = this.children[0];
     var displayArr = this.parentElement.children;
     var display = "";// fieldset区域内的所有元素的显示与否
     if(fontObj.innerHTML == '6'){// 当前是显示，则隐藏操作
      fontObj.innerHTML = '4';
      display = "none";
      // 是否触发隐藏事件      
      if(this.parentElement.onHideEvent != undefined && this.parentElement.onHideEvent != ''){
       eval(this.parentElement.onHideEvent);
      }
      document.getElementById("fieldSetDiv_"+this.parentElement.uniqueID).style.display = '';
     }else{//当前是隐藏，则显示操作
      fontObj.innerHTML = '6';
      display = "";
      // 是否触发显示事件
      if(this.parentElement.onShowEvent != undefined && this.parentElement.onShowEvent != ''){
       eval(this.parentElement.onShowEvent);
      }
      document.getElementById("fieldSetDiv_"+this.parentElement.uniqueID).style.display = 'none';
     } 
     // fieldset区域内的所有元素(除了legend)的显示与否      
     for(var k=0; k<displayArr.length; k++){
         if(displayArr[k].nodeName != 'LEGEND' && displayArr[k].className != 'fieldSetHiddenCss'){
       displayArr[k].style.display = display;
      }      
     }
    };
    
    // legend的鼠标滑过事件
    child.onmouseover = function(){
     this.style.color = "red";
    };
    
    // legend的鼠标滑出事件
    child.onmouseout = function(){
     this.style.color = fontColor;
    };
    
    // fieldset添加show()事件，可以通过js调用
    child.parentElement.show = function(){
     var fontObj = this.children[0].children[0];
     var displayArr = this.children;
     fontObj.innerHTML = '6';
     // 是否触发显示事件
     if(this.onShowEvent != undefined && this.onShowEvent != ''){
      eval(this.onShowEvent);
     }
     document.getElementById("fieldSetDiv_"+this.uniqueID).style.display = 'none';
     // 控制fieldset区域内的所有元素(除了legend)的显示
     for(var k=0; k<displayArr.length; k++){
         if(displayArr[k].nodeName != 'LEGEND' && displayArr[k].className != 'fieldSetHiddenCss'){
       displayArr[k].style.display = "";
      }      
     }
    };
    
    // fieldset添加hide()事件，可以通过js调用
    child.parentElement.hide = function(){
     var fontObj = this.children[0].children[0];
     var displayArr = this.children;
     fontObj.innerHTML = '4';
     // 是否触发隐藏事件
     if(this.onHideEvent != undefined && this.onHideEvent != ''){
      eval(this.onHideEvent);
     }
     document.getElementById("fieldSetDiv_"+this.uniqueID).style.display = '';
     // 控制fieldset区域内的所有元素(除了legend)的隐藏
     for(var k=0; k<displayArr.length; k++){
         if(displayArr[k].nodeName != 'LEGEND' && displayArr[k].className != 'fieldSetHiddenCss'){
       displayArr[k].style.display = "none";
      }      
     }
    };
    continue;
   }   
  }
 } 
}