求一个jquery展开隐藏效果

说明：1.页面有多个这种效果2.不是隐藏整个div的那种（默认显示一些内容，点击展开显示更多详情）3.展开和隐藏按钮是根据内容变化的... 说明：

1.页面有多个这种效果
2.不是隐藏整个div的那种（默认显示一些内容，点击展开显示更多详情）
3.展开和隐藏按钮是根据内容变化的展开

 我来答

3个回答

#热议# 不吃早饭真的会得胆结石吗？

ZivenZhang
2012-09-14 · TA获得超过228个赞

知道小有建树答主

回答量：303

采纳率：0%

帮助的人：120万

我也去答题访问个人页

关注

展开全部

楼上正解。先用JUQERY截取一段内容或者DIV之类。不知道你要显示隐藏的是什么样的内容！

本回答由提问者推荐

已赞过 已踩过<

评论收起

feichang小雨
2012-09-14 · TA获得超过154个赞

知道小有建树答主

回答量：418

采纳率：50%

帮助的人：278万

我也去答题访问个人页

关注

展开全部

你可以考虑先判断字数，比如，超出100个字，用JS作字符剪切，然后显示“展开”按钮，没有超出范围的，直接显示。

追问

偶对js基本属于一点不懂

本回答被网友采纳

已赞过 已踩过<

评论收起

爱你暖手
2012-09-13 · TA获得超过281个赞

知道小有建树答主

回答量：193

采纳率：100%

帮助的人：123万

我也去答题访问个人页

关注

展开全部

不知道楼主想要的是什么效果，我写个简单的看是不是楼主想要的。样式要你自己定义下哦。
那个JQuery的引用你引用你本地的吧，我是本地测试没问题的。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>代码</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$(".content div").hide();//默认不显示指定区域的所有内容
$(".content div:first").show();//显示第一个按钮下的内容区
$(".nav li").each(function(index) {
$(this).click(function(){
$(".content div").eq(index).addClass(".showcss").show().end().eq(index).siblings().removeClass(".showcss").hide();
})
});
})
</script>
<style>
.showcss{display:block;}
</style>
</head>
<body>
<ul class="nav">
<li>栏目1</li>
<li>栏目2</li>
<li>栏目3</li>
</ul>
<div class="content">
<div><h2>栏目1</h2>栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目</div>
<div><h2>栏目2</h2>栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目</div>
<div><h2>栏目3</h2>栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目栏目</div>
</div>
</body>
</html>

已赞过 已踩过<

评论收起

更多回答（1）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

求一个jquery展开隐藏效果

为你推荐：