Javascript实现代码折叠功能
来源: 阅读:1225 次 日期:2016-08-30 14:14:24
温馨提示: 小编为您整理了“Javascript实现代码折叠功能”,方便广大网友查阅!

代码折叠起来,使整段程序缩成一行,看起来清爽了许多。大家在使用Visual Studio环境进行开发时,可以把某个类或某个函数折叠起来,在很多网页上也有类似的功能,那到底是如何实现的呢?其实很简单,只要通过JavaScript就可以实现。

一、首先定义一个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"

例子如下:

onclick="puckerMenu('1');">

src="images/minus.gif">public class DataAccess

  • private string connString;

    onclick="puckerMenu('2');">

    src="images /plus.gif">protected DbConnection OpenConnection()

  • {...}

  • Other

    Baidu
    map

    总结

    以上就是本文的全部内容,希望对有需要的人能有所帮助。

  • 更多信息请查看 网络编程
    【点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】 【点此处查询各地各类考试咨询QQ号码及交流群】
    上一篇: 轻松掌握JavaScript策略模式
    下一篇: jQuery组件easyui对话框实现代码
    手机网站地址: Javascript实现代码折叠功能
    由于各方面情况的不断调整与变化, 提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!
    相关阅读 网络编程

    2026上岸·考公考编培训报班

    • 报班类型
    • 姓名
    • 手机号
    • 验证码
    最新信息
    公考类
    招聘类
    各类考试
    关于我们| 联系我们| 人才招聘| 网站声明| 网站帮助| 非正式的简要咨询| 简要咨询须知| 新媒体/短视频平台| 手机站点| 投诉建议
    工业和信息化部备案号:滇ICP备2023014141号-1 云南省教育厅备案号:云教ICP备0901021 滇公网安备53010202001879号 人力资源服务许可证:(云)人服证字(2023)第0102001523号
    云南网警备案专用图标
    联系电话:0871-65099533/13759567129 获取招聘考试信息及咨询关注公众号:
    咨询QQ:1093837350(9:00—18:00) 版权所有:
    云南网警报警专用图标
    Baidu
    map