折叠展开js代码素材（javascript折叠菜单）

本篇文章给大家谈谈折叠展开js代码素材，以及javascript折叠菜单对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、eclipse中js代码如何设置可折叠？
• 2、javascript怎么实现列表显示与折叠
• 3、csdn论坛中的展开收起怎么做的？求js代码。。。

eclipse中js代码如何设置可折叠？

js代码设置可折叠设置：

设置代码折叠在菜单栏的窗口--首选项

1、选择常规--编辑器--structure text editors，可以看到Enable folding选项，打上勾就可以使用代码折叠功能，但还要在具体的语言中设置。

2、选择js--编辑器--折叠，选择启用折叠就可以让js的代码折叠了。

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"

例子如下：

body

divstyle="CURSOR: hand"

onclick="puckerMenu('1');"IMGid=level1

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

ulid=row1

li private string connString;

divstyle="CURSOR: hand"

onclick="puckerMenu('2');"IMGid=level2

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

ulid=row2style="display:none"{...}/ul

li

Other

/ul

/body

csdn论坛中的展开收起怎么做的？求js代码。。。

原来是这个"展开"，我还以为是字数过长的“展开”，白写了一个。还要工作，如果没人写有空了给你写一个。（能用jquery么？）

/******************************************************************************************************

不上CSDN，不知道你说的是什么，现写一个，jquery版，使用前请包涵jquery库。

/*

* 展开

* 第一个参数是想要缩略的段落的jquery object

* 第二个是缩略后的长度类型是int

*/

function span($obj,len)

{

var h=$obj.html();

if(h.lengthlen)//长度超过规定长度就把后边隐藏

$obj.html(h.substr(0,len)+"span class='span'展开更多/spanspan class='hide'"+h.substr(len)+"/span");

}

/*

* 折叠

* 参数是折叠按钮的jquery object

*/

function coll($o)

{

$o.hide();

var $p=$o.parents(".collapsible");

console.log($p);

$p.find(".hide").hide();

$p.find(".span").show();

}

$(function(){

span($(".collapsible"),10);//这里以.collapsible为例，如果长度超过10个字就把后边的隐藏

$(".span").click(function(){//展开

var $h=$(this).next(".hide");

$(this).hide();

$h.show();

$h.append("span class='coll'折叠/span");

$(".coll").click(function(){

coll($(this));//折叠

})

});

})

折叠展开js代码素材的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于javascript折叠菜单、折叠展开js代码素材的信息别忘了在本站进行查找喔。