AutoCAD 3DMAX C语言 Pro/E UG JAVA编程 PHP编程 Maya动画 Matlab应用 Android
Photoshop Word Excel flash VB编程 VC编程 Coreldraw SolidWorks A Designer Unity3D
 首页 > JavaScript

Javascript实现代码折叠功能

51自学网 http://www.wanshiok.com
vs2015,js代码折叠,vs2010,js代码折叠,js折叠代码

一、首先定义一个JavaScript function,如下:

function puckerMenu(level) {var levelLength = ('row' + level).length;var toDo = '0';for (var iCount = 0 ; iCount < document.all.length; iCount++){if ( document.all[iCount].id.indexOf('row' + level) > -1 && ( document.all[iCount].id.length > levelLength)) {if ( document.all('level' + level).src.indexOf('minus.gif') > -1 ) {document.all[iCount].style.display = 'none';toDo = '1';} else {document.all[iCount].style.display = 'block';toDo = '0';}} }if ( toDo == '1' ) {document.all('level' + level).src = 'images/plus.gif'; } else {document.all('level' + level).src = 'images/minus.gif'; }}

二、然后在网页上定义一个div和一个ul,注意div中要包含一个idlevel开头的image和一个onclick事件,ulid要包含row,默认情况下是展开的,如果需要默认为闭合,则要在ul中加入style="display:none"

例子如下:

<body><divstyle="CURSOR: hand"onclick="puckerMenu('1');"><IMGid=level1src="images/minus.gif">public class DataAccess</div><ulid=row1><li> private string connString;<divstyle="CURSOR: hand"onclick="puckerMenu('2');"><IMGid=level2src="images /plus.gif">protected DbConnection OpenConnection()</div><ulid=row2style="display:none">{...}</ul><li>Other</ul></body>

总结

以上就是本文的全部内容,希望对有需要的人能有所帮助。如果有疑问可以留言讨论。


vs2015,js代码折叠,vs2010,js代码折叠,js折叠代码  
上一篇:Javascript 6里的4个新语法  下一篇:深入浅出ES6之let和const命令