jquery hide,show方法问题
有AB2个层，B在A里面，初始display都是none，首先是显示效果，A.show()后B.show('500');效果正常：A层先显示，B层以500的速度匀速逐渐显...
有AB 2个层，B在A里面，初始display都是none，首先是显示效果，A.show()后B.show('500'); 效果正常：A层先显示，B层以500的速度匀速逐渐显示
但是隐藏出现了问题，希望达到的效果是B层先以500的速度hide，然后A再hide，但无论如何顺序，都是AB一起瞬间都隐藏掉了，请问有没有办法在隐藏的时候，让B确实先执行完.hide('500')后再让A.hide()？ 展开
但是隐藏出现了问题，希望达到的效果是B层先以500的速度hide，然后A再hide，但无论如何顺序，都是AB一起瞬间都隐藏掉了，请问有没有办法在隐藏的时候，让B确实先执行完.hide('500')后再让A.hide()？ 展开
4个回答
展开全部
在jquery中我显示与隐藏元素可以直接使用show()和hide()来操作，这比起js中的操作要方便了，同时show()和hide()还可以 设置参数让我们的运行有个缓存效果
首先来看个段落文字的显示和隐藏
1：show() 方法
显示出隐藏的 <p> 元素。代码如下：
$(".btn2").click(function(){
$("p").show();
});
2：hide()隐藏可见的 <p> 元素：代码如下：
$(".btn1").click(function(){
$("p").hide();
});
3：jQuery代码如下：
$("element").show("slow");
运行该代码后，元素将在600毫秒内慢慢的显示出来。其它的速度关键字还有”normal“和”fast“（长度分别是400毫秒和200毫秒）。
不仅如此，还可以为显示速度指定一个数字，单位是毫秒。
例如，使用如下代码使元素在1秒钟（1000毫秒）内显示出来；
$(”element").show(1000);在前面的例子中，把其中的hide()方法改为hide(600),show()方法改为show(600)。
jQuery代码如下：
$(function () {
$("#panel h5.head").toggle(function () {
$(this).next().hide(600);
}, function () {
$(this).next().show(600);
})
});
从代码的执行过程中，可以发现，hide(600)方法会同时减少“内容”的高度、宽度和不透明度，直至3个属性的值为0，最后设置该元素的CSS规则为“display:none”。
然后我们再来看个简单的代码：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
$("p").hide();
});
$(".btn2").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button class="btn1">Hide</button>
<button class="btn2">Show</button>
</body>
</html>
这个就是超简单的显示与隐藏了，如果要有效果我们只要在hide或show中带时间或参数即可：
代码如下：
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
$("p").hide(1000);
});
$(".btn2").click(function(){
$("p").show(1000);
});
});
</script>
首先来看个段落文字的显示和隐藏
1：show() 方法
显示出隐藏的 <p> 元素。代码如下：
$(".btn2").click(function(){
$("p").show();
});
2：hide()隐藏可见的 <p> 元素：代码如下：
$(".btn1").click(function(){
$("p").hide();
});
3：jQuery代码如下：
$("element").show("slow");
运行该代码后，元素将在600毫秒内慢慢的显示出来。其它的速度关键字还有”normal“和”fast“（长度分别是400毫秒和200毫秒）。
不仅如此，还可以为显示速度指定一个数字，单位是毫秒。
例如，使用如下代码使元素在1秒钟（1000毫秒）内显示出来；
$(”element").show(1000);在前面的例子中，把其中的hide()方法改为hide(600),show()方法改为show(600)。
jQuery代码如下：
$(function () {
$("#panel h5.head").toggle(function () {
$(this).next().hide(600);
}, function () {
$(this).next().show(600);
})
});
从代码的执行过程中，可以发现，hide(600)方法会同时减少“内容”的高度、宽度和不透明度，直至3个属性的值为0，最后设置该元素的CSS规则为“display:none”。
然后我们再来看个简单的代码：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
$("p").hide();
});
$(".btn2").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button class="btn1">Hide</button>
<button class="btn2">Show</button>
</body>
</html>
这个就是超简单的显示与隐藏了，如果要有效果我们只要在hide或show中带时间或参数即可：
代码如下：
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
$("p").hide(1000);
});
$(".btn2").click(function(){
$("p").show(1000);
});
});
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
show, hide 都有 callback 函数，callback 就是在一个动作完成之后【再】执行的函数
$("#divB").hide(500, function() {
$("#divA").hide();
});
$("#divB").hide(500, function() {
$("#divA").hide();
});
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
$(b).hide(500,function(){
$(a).hide();
})
$(a).hide();
})
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
需要用animate自定义动画
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
