87,989
社区成员
发帖
与我相关
我的任务
分享jquery问题，有没有哪个库可以隐藏或显示一些列
table有若干列
P0 P1, P2 P3 P4 P5 P6 P7 P8
如何实现点P0隐藏P1，P2，P3,P4
点击P5 ,隐藏P6，P7，P8
再次点击则显示出来
这可以实现吗？
P0 P1, P2 P3 P4 P5 P6 P7 P8
如何实现点P0隐藏P1，P2，P3,P4
点击P5 ,隐藏P6，P7，P8
再次点击则显示出来
这可以实现吗？
...全文
请发表友善的回复…
发表回复
乌镇程序员 2011-06-22
- 打赏
- 举报
[Quote=引用 6 楼 crafet 的回复:]
hide或者show可以加入动画效果吗
我是说淡入淡出
我记得有toggle（1000） 1秒这样子可以做到吗
引用 2 楼 t5500 的回复:
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everyt……
[/Quote]
hide('slow')、show('slow')用在表格里面貌似会有点问题，每次会出现空隙，而且这个空隙会累积增加。
hide或者show可以加入动画效果吗
我是说淡入淡出
我记得有toggle（1000） 1秒这样子可以做到吗
引用 2 楼 t5500 的回复:
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everyt……
[/Quote]
hide('slow')、show('slow')用在表格里面貌似会有点问题，每次会出现空隙，而且这个空隙会累积增加。
zell419 2011-06-22
- 打赏
- 举报
.fadeIn("1000");
.fadeOut("1000");
淡入淡出是这个 。
.fadeOut("1000");
淡入淡出是这个 。
crafet 2011-06-22
- 打赏
- 举报
hide或者show可以加入动画效果吗
我是说淡入淡出
我记得有toggle（1000） 1秒这样子可以做到吗
[Quote=引用 2 楼 t5500 的回复:]
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everything.
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h……
[/Quote]
jhrxx 2011-06-22
- 打赏
- 举报
[Quote=引用 4 楼 crafet 的回复:]
write nothing,do everything
sounds funny
引用 2 楼 t5500 的回复:
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everything.
HTML code
<!……
[/Quote]
not noting.
write less, do more
write nothing,do everything
sounds funny
引用 2 楼 t5500 的回复:
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everything.
HTML code
<!……
[/Quote]
not noting.
write less, do more
crafet 2011-06-22
- 打赏
- 举报
write nothing,do everything
sounds funny
[Quote=引用 2 楼 t5500 的回复:]
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everything.
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h……
[/Quote]
sounds funny
[Quote=引用 2 楼 t5500 的回复:]
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everything.
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h……
[/Quote]
zt735268255 2011-06-21
- 打赏
- 举报
$(function(){
$('#P0').click(function(){
if($('#p1').show()){
$('#p1').hide();
$('#p2').hide();
$('#p3').hide();
$('#p4').hide();
}else{
$('#p1').show();
$('#p2').show();
$('#p3').show();
$('#p4').show();
}
})
})
给个思路给你
$('#P0').click(function(){
if($('#p1').show()){
$('#p1').hide();
$('#p2').hide();
$('#p3').hide();
$('#p4').hide();
}else{
$('#p1').show();
$('#p2').show();
$('#p3').show();
$('#p4').show();
}
})
})
给个思路给你
乌镇程序员 2011-06-20
- 打赏
- 举报
这种过于个性化的需求应该找不到现成的通用代码，尽管jQuery的宣传口号是Write Less, Do More，但是总归还是需要自己写一部分的，据我所知，还没有哪一种语言能牛叉到Write Nothing, Do Everything.
<!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="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.min.js"></script>
<style type="text/css">
table { border-collapse:collapse; }
td { border:1px solid #CCC; font:12px Tahoma, Geneva, sans-serif; text-align:center; width:50px; }
</style>
<script type="text/javascript">
$(document).ready(function() {
$("td:eq(0)").toggle(
function() {
$("td").each(function() {
if ($(this).index() % 9 >= 1 && $(this).index() % 9 <= 4) $(this).hide();
});
}, function() {
$("td").each(function() {
if ($(this).index() % 9 >= 1 && $(this).index() % 9 <= 4) $(this).show();
});
});
$("td:eq(5)").toggle(function() {
$("td").each(function() {
if ($(this).index() % 9 >= 6 && $(this).index() % 9 <= 8) $(this).hide();
});
}, function() {
$("td").each(function() {
if ($(this).index() % 9 >= 6 && $(this).index() % 9 <= 8) $(this).show();
});
});
});</script>
</head>
<body>
<table border="0">
<tr>
<td>P0</td>
<td>P1</td>
<td>P2</td>
<td>P3</td>
<td>P4</td>
<td>P5</td>
<td>P6</td>
<td>P7</td>
<td>P8</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>
001007009 2011-06-20
- 打赏
- 举报
楼主试试
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.9.0/build/reset/reset-min.css">
<style type="text/css"><!--
body { font-size:12px; font-family:"宋体"; }
.wrapper { margin:10px auto; width:700px; }
table {
font-size:20px;
}
td{
padding:10px;
border:1px solid green;
}
--></style>
</head>
<body>
<div class="wrapper">
<table>
<tr>
<td>第一章</td>
<td>1-1</td>
<td>1-2</td>
<td>1-3</td>
<td>第二章</td>
<td>2-1</td>
<td>2-2</td>
</tr>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
</table>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">//<![CDATA[
$(function(){
$('tr:first td:first').click(function(){
if( $(this).next().is(':visible') ){
$('tr').each(function(){
$(this).find('td:gt(0):lt(3)').hide();
})
}else{
$('tr').each(function(){
$(this).find('td:gt(0):lt(3)').show();
})
}
})
$('tr:first td:eq(4)').click(function(){
if( $(this).next().is(':visible') ){
$('tr').each(function(){
$(this).find('td:gt(4)').hide();
})
}else{
$('tr').each(function(){
$(this).find('td:gt(4)').show();
})
}
})
})
//]]></script>
</body>
</html>
