The jquery collapse menu can be called multiple times on the same page

Original JS version * * * start
Window.onload=function () {
Shared function Area
var ibase={
document.getElementById
Id:function (name) {return document.getElementById (name)},
Get elements from class
Getbyclass:function (Name,tagname,elem) {
var c=[];
var re=new regexp (' (^|s) ' +name+ ' (|s$) ');
var e= (Elem | | document). getElementsByTagName (TagName | | '*');
for (Var i=0 i < e.length; i++) {
if (Re.test (E[i].classname)) {
C.push (E[i]);
}
}
return C;
},
Get style properties
Attrstyle:function (elem,attr) {
if (elem.attr) {
return elem.style[attr];
}else if (elem.currentstyle) {
return elem.currentstyle[attr];
}else if (Document.defaultview && document.defaultview.getcomputedstyle) {
Attr=attr.replace ([[A-z])/g, '-$1 '). toLowerCase ();
Return Document.defaultview.getcomputedstyle (elem,null). GetPropertyValue (attr);
}else{
return null;
}
},
Gets the elements in the ancestor element that match the specified style
Parents:function (elem,name) {
var r=new regexp (' (^|s) ' +name+ ' (|s$) ');
Elem=elem.parentnode;
if (elem!=null) {
Return R.test (elem.classname)? Elem:ibase.parent (elem,name) | | Null
}
},
Fetch index Value
Index:function (cur,obj) {
for (Var i=0 i < obj.length; i++) {
if (obj[i]==cur) {
return i;
}
}
}

}

Variable definition
var listbox=ibase.getbyclass (' js ', ' div ');
var navitem=ibase.id (' demo '). getElementsByTagName (' H2 ')//The H2 in the JQ block is also taken here, so the page will have a small error
var icoitem=null,boxitem=null,boxdisplay=null,elemindex=null,elemparent=null;
Initialize to expand the first
for (Var i=0 i < listbox.length;i++) {
Ibase.getbyclass (' box ', ' div ', listbox[i]) [0].style.display= ' block ';
Listbox[i].getelementsbytagname (' span ') [0].innerhtml= '];
}
Iterate through all the clicks
for (Var i=0 i < navitem.length;i++) {
Navitem[i].onclick=function () {
Elemparent=ibase.parents (this, ' JS ');//Get current click on the Block
Navitem=elemparent.getelementsbytagname (' H2 ');//Get the click item under the current block
Icoitem=elemparent.getelementsbytagname (' span ');//Get the unwind off of the current block
Boxitem=ibase.getbyclass (' box ', ' div ', elemparent);/get the block that needs to be controlled
Elemindex=ibase.index (This,navitem)//Get current Click Index in current block click item
Toggle Expand Close Icon
Icoitem[elemindex].innerhtml= icoitem[elemindex].innerhtml== '-'? '+' : '-';
if (Ibase.attrstyle (Boxitem[elemindex], ' display ') = = ' block ') {
The control expands state, hides the current, and expands the other first item
Here's an expanded 0/1 judgment, because when you click on the first one, you can't start the first one.
Boxitem[elemindex].style.display= ' None ';
if (elemindex==0) {
boxitem[1].style.display= ' block ';
Icoitem[1].innerhtml= '-'
}else{
Boxitem[0].style.display= ' Block '
Icoitem[0].innerhtml= '-'
}
}else{
In the control expansion state, expand the current, hide other items
boxitem[elemindex].style.display= ' block ';
for (Var k=0;k < boxitem.length; k++) {
if (K!=elemindex) {
Boxitem[k].style.display= ' None ';
Icoitem[k].innerhtml= ' + ';
}
}
}
}
}

}

jquery Version * * * start
$ (function () {
Variable definition Area
var _listbox=$ ('. JQ ');
var _navitem=$ ('. Jq>h2 ');
var _boxitem=null, _icoitem=null, _parents=null, _index=null;

Initialize first expansion
_listbox.each (function (i) {
$ (this). Find (' Div.box '). EQ (0). Show ();
$ (this). Find (' H2>span '). EQ (0). Text ('-');
});

//Traverse all clicks
_navitem.each (function (i) {
$ (this). Click (function () {
//Find the element that currently clicks the parent element as a listbox (a single chunk)
_ parents=$ (This). Parents ('. ListBox ');
_navitem=_parents.find (' H2 ');//Click item in this block
_icoitem=_parents.find (' span ');//Expand Close icon in this block
_boxitem=_ Parents.find (' Div.box '); in this block, expand the close item
_index=_navitem.index (this);//Get the index value of the currently clicked item in the current block click
if (_boxitem.eq Index). Is (': Visible ') {
//If the expand Close item under the current Click item is displayed, close, and then expand the first
_boxitem.eq (_index) in the other item. Hide (). End (). Not (': eq () +_index+ '). ().
_icoitem.eq (_index). Text (' + '). (). Not (': eq (' +_index+ ') ').
}else{
//If the expand Close item under the current click Item is hidden, expand, and hide Other items
_boxitem.eq (_index). Show (). ". Not (': eq (' +_index+ ') '). Hide ( );
_icoitem.eq (_index). Text ('-'). End (). Not (': eq (' +_index+ ') '). Text (' + ');
}
});
});
});