本文通过三个示例展示了如何使用jQuery实现元素的显示、隐藏及切换，并为按钮绑定点击事件来改变元素状态，同时介绍了如何利用回调函数进行操作完成提示。
1. <script type="text/javascript">
//show（）和hide（）中除了可以放时间，还可以放函数
$(function(){
$("#box").show(2000, function () {//2秒时间显示，然后2秒时间隐藏
$("#box").hide(2000,function(){
alert("操作完成！");
})
})
});
//show（）和hide（）中除了可以放时间，还可以放函数
$(function(){
$("#box").show(2000, function () {//2秒时间显示，然后2秒时间隐藏
$("#box").hide(2000,function(){
alert("操作完成！");
})
})
});
</script>
2.<script type="text/javascript">
$(function () {
$("#bt").click(function () {//绑定点击事件
alert("我被点击了");
})
})
</script>
</head>
<body>
<input type="button"value="点击"id="bt">
$(function () {
$("#bt").click(function () {//绑定点击事件
alert("我被点击了");
})
})
</script>
</head>
<body>
<input type="button"value="点击"id="bt">
</body>
3.<script type="text/javascript">
function showInfo(){
$("#box").toggle(2000);//如果显示就隐藏，如果隐藏就显示
if($("#bt").val()=="显示"){
$("#bt").val("隐藏");
}else{
$("#bt").val("显示");
}
}
</script>
function showInfo(){
$("#box").toggle(2000);//如果显示就隐藏，如果隐藏就显示
if($("#bt").val()=="显示"){
$("#bt").val("隐藏");
}else{
$("#bt").val("显示");
}
}
</script>
扫一扫
400
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
