关于jQuery的toggle()方法
0
悬赏园豆：10
[已解决问题]
解决于 2013-02-22 17:48
$(function () {
$("h5").toggle(function () {
$(this).next("div").show();
}, function () {
$(this).next("div").hide();
});
});
想用toggle()控制div的单击显隐，但是这么写为什么一打开页面，标题和div就全渐渐消失了？
问题补充：
完整的：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="../script/jquery-1.9.1.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<div id="panel">
<h5>什么是心锚？</h5>
<div>
在我们生活的周围，有许多东西当我们一看见，便会油然兴起各种不同的心情。像这种能刺激产生特别感觉的东西，不管它是好是坏，我们称之为心锚。就是在心中所放的书签一样，可以在需要的时候，取用心锚设置时的心理状态，举个例来说，如果一个人在小时候有气球爆在他脸上的经验，以后再碰到气球的时候可能就会跑的远远的，这就是一种自然设置的心锚。
</div>
</div>
<script type="text/javascript">
$(function () {
$("#panel h5").toggle(function () {
$(this).next("div").show();
}, function () {
$(this).next("div").hide();
});
});
</script>
</body>
</html>
最佳答案
1
应该可以的， 最好把你的HTML和JS都贴出来，看看是不是其它问题
收获园豆：10
贴出来完整的了，帮忙看一下吧，谢谢了
@Rakanishu5: 我这打开，没有你说的现象哦
@Yu: 奇怪了。。不会是环境的问题吧？我vs2012，在ie8、chrome下跑都有问题。。。
@Rakanishu5: 我用jquery-1.9.1.js，就有你说的问题，改成这样就可以了：
$("#panel h5").click(
function () {
$(this).next("div").toggle();
}
);
@Yu: 是么，那看来是jQuery更新的问题。只是想试试toggle()里面定义两个函数的那种写法。类似hover()这样的：
$("h5").hover(function () {
$(this).next("div").show();
}, function () {
$(this).next("div").hide();
});
这个没问题，可以掠过控制显隐。
感觉现在toggle()这样写的效果变成了：先切换<h5>的显隐，再执行第二个function()，总之有点乱。
大约我看的书有点老。。。谢谢了。
其他回答(2)
1
是不是这个 选择器h5 范围太大了
没，就一个h5。。hover()方法这么写就没问题。。能掠过控制显隐，但不知道为什么toggle()就不行。。
0
Jquery1.9.1中 toggle（fn1,fn2...）方法 可实现点击一个元素来执行指定函数。此方法被删除以减少混乱和提高潜在的模块化程度。只保留了显示和隐藏的功能！
嗯，谢谢。好久之前的问题了。。。-.-|
