Javascript实现代码折叠功能
Javascript实现代码折叠功能
发布时间:2016-12-30 来源:查字典编辑
摘要:一、首先定义一个JavaScriptfunction,如下:functionpuckerMenu(level){varlevelLength...

一、首先定义一个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中要包含一个id为level开头的image和一个onclick事件,ul中id要包含row,默认情况下是展开的,如果需要默认为闭合,则要在ul中加入style="display:none"

例子如下:

<body> <divstyle="CURSOR: hand"><IMGid=level1 src="images/minus.gif">public class DataAccess</div> <ulid=row1> <li> private string connString; <divstyle="CURSOR: hand"><IMGid=level2 src="images /plus.gif">protected DbConnection OpenConnection()</div> <ulid=row2style="display:none">{...}</ul> <li> Other </ul> </body>

总结

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

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类