javascript 中toggle()函数点击第一下为什么不起作用

答案:4 悬赏:60

解决时间 2021-02-16 23:50

提问者网友：焚苦与心
2021-02-16 09:03

最佳答案

二级知识专家网友：十年萤火照君眠
2021-02-16 09:13

先看看toggle的文档：
.toggle( handler(eventObject), handler(eventObject) [, handler(eventObject)] )
handler(eventObject)A function to execute every even time the element is clicked.
handler(eventObject)A function to execute every odd time the element is clicked.

给某个对象调用toggle()之后，此后的该对象上的每第奇数次点击都会调用handle1，每第偶数次点击调用handle2。

这样的话就解释得通了。从上面的代码来看，

上的每次点击都会给

加上一次toggle，在加上toggle之后，

上的每奇数次点击会执行 $("#ss").toggle(); 每偶数次点击会执行：$("#sss").toggle();

所以，第一次

的点击只是给

加上toggle，而不会执行 $("#ss").toggle(); 和 $("#sss").toggle(); 所以显示不会有任何变化；
第二次

的点击会执行$("#ss").toggle(); 所以会显示 “Hello1 Again” ；于此同时，又给

加上了一层 toggle。
第三次

的点击会执行$("#sss").toggle(); 这是执行第一点击加上的toggle的handler2，同时还会执行 $("#ss").toggle(); 这是第二次点击加上的toggle();
.....
后面的情况就越来越复杂了。

按照你的需求，其实是hello每点击一次，下面两个元素交替显示，建议改成这样：

$(document).ready(function(){
$("p").toggle(
function(){
$("#ss").show();
$("#sss").hide();
},
function(){
$("#ss").hide();
$("#sss").show();
}
);
})

全部回答

1楼网友：狂恋
2021-02-16 13:33

toggle()函数怎么实现的，代码贴下看看

2楼网友：患得患失的劫
2021-02-16 12:24

楼主用jquery呀。
第三行
$("p").改为$

3楼网友：孤独的牧羊人
2021-02-16 10:50

想实现切换?可这上面的代码肯定是不能实现朋友想要的结果的，根本不正确，能补充一下想实现的结果和整个Html代码么
<html>
<head>
<script type='text/javascript' src='jquery-1.3.2.js' charset='utf-8'></script>
</head>
<body>
<p>Hello</p><p id="ss" style="display: none">Hello1 Again</p><p id="sss" style="display: none">Hello2 Again</p>
<script>
$(document).ready(function(){
$("p").click(function(){
$("p").toggle(
function(){
$("#ss").toggle();
},
function(){
$("#sss").toggle();
}
);
});
})
</script>
</body>
</html>
点击第一下是起作用的啊

我要举报

如以上问答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！