jQuery的显示和隐藏
在 jQuery 中可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素,以及使用 toggle() 方法能够切换 hide() 和 show() 方法。
隐藏例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquey隐藏显示</title>
<!-- jquery文件自己下载引用近来即可,我这里是1.12.0的压缩版 -->
<script type="text/javascript" src="jquery-1.12.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('p').click(function(){
$(this).hide();
})
})
</script>
</head>
<body>
<p>点我,消失</p>
<p>点我,我也消失</p>
</body>
</html>
通过 jQuery,还可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquey隐藏显示</title>
<style>
div{width:100px;height:100px;border:1px solid red;}
</style>
<!-- jquery文件自己下载引用近来即可,我这里是1.12.0的压缩版 -->
<script type="text/javascript" src="jquery-1.12.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.show1').click(function(){
$('div').show(1000);
})
$('.hide1').click(function(){
$('div').hide(1000);
})
})
</script>
</head>
<body>
<button class="show1">显示</button>
<button class="hide1">隐藏</button>
<div>
<p>点我,消失</p>
<p>点我,我也消失</p>
</div>
</body>
</html>
通过 jQuery,您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquey隐藏显示</title>
<style>
div{width:100px;height:100px;border:1px solid red;}
</style>
<!-- jquery文件自己下载引用近来即可,我这里是1.12.0的压缩版 -->
<script type="text/javascript" src="jquery-1.12.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".show1").click(function(){
$("div").toggle("slow");
});
});
</script>
</head>
<body>
<button class="show1">显示&隐藏</button>
<div>
<p>点我,消失</p>
<p>点我,我也消失</p>
</div>
</body>
</html>
jQuery的显示和隐藏的更多相关文章
- jQuery学习-显示与隐藏
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Jquery的显示与隐藏
$(selector).hide(speed,callback); $(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度,可以取以下值:&q ...
- jquery效果- 显示和隐藏 淡入淡出 滑动 隐藏
jQuery 效果- 隐藏和显示:hide() 和 show() 规定隐藏/显示的速度,可以取以下值:"slow"."fast" 或毫秒 您可以使用 toggl ...
- jquery统计显示或隐藏的元素个数
统计显示的checkbox的数量: 统计隐藏的checkbox数量:
- 7.jQuery之显示与隐藏效果
这里用到三个函数方法:show() hide() toggle() 注意点是三个方法里面的两个参数的使用,前一个参数是时间,表示显示速度:后一个参数是回调函数,只有前面的动画执行完之后,回调函数 ...
- jquery实现显示和隐藏toggle()方法的使用
<!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...
- toggle显示与隐藏切换
jQuery中显示与隐藏切换toggle方法 show与hide是一对互斥的方法.需要对元素进行显示隐藏的互斥切换,通常情况是需要先判断元素的display状态,然后调用其对应的处理方法.比如显示的元 ...
- js 与JQuery显示及隐藏方法
虽然以后两种方式都能让文本信息隐藏和显示 第一种文本隐藏以后还是会占居位置, 第二种则不会占位置. <p id="p1">这是一段文本.</p> <i ...
- jQuery判断当前元素显示状态并控制元素的显示与隐藏
1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible'); //true为显示,false为隐藏 $("#id") ...
随机推荐
- 逐层解析请求json参数字符串【我】
import net.sf.json.JSONObject; 逐层解析请求json参数字符串: InputStream inStream =null; BufferedReader br =null; ...
- osg 渲染ifc数据-测试
直接使用osg渲染ifc数据,提高渲染速度. #include "teslamanage.h" #include <QtWidgets/QApplication> #i ...
- 算法习题---4-9数据挖掘(Uva1591)
一:题目 这是最懵逼的一道题,什么鬼......... [刷题]算法竞赛入门经典(第2版) 4-9/UVa1591 - Data Mining(详细题目看这个吧,不想多说) 二:代码实现 #defin ...
- 【Mybatis】MyBatis之Generator自动生成代码(九)
MyBatis Generator 简介 MyBatis Generator 连接数据库表并生成MyBatis或iBatis文件.这有助于最大限度地减少使用MyBatis时为数据库文件创建简单CRUD ...
- Cheng MeiChun团队的技术支持
本网页为Cheng MeiChun团队的技术支持网址,如果在我们开发的游戏中遇到任何问题,欢迎联系我们! QQ:1505478990 邮箱:1505478990@qq.com
- spring 使用@Bean装配Bean
通过@Component装配Bean,但是@Component只能注解在类上,不能注解到方法上.对于Java而言,大部分的开发都需要引入第三方的包(jar文件),而且往往并没有这些包的源码,这时候将无 ...
- win8(x64)下,重新安装delphi 2007时出现“Invalid Serial Number”,如何解决?
1)在添加删除程序里卸载delphi 2007 2)删除C:\ProgramData\CodeGear 3)删除C:\Program Files (x86)CodeGear 4)删除d:\Progra ...
- 安装 KVM
安装 KVM 需要的包 sudo apt-get install -y qemu-kvm qemu-system libvirt-bin virt-manager bridge-utils vlan ...
- R Multiple Plots
R Multiple Plots In this article, you will learn to use par() function to put multiple graphs in a s ...
- 【计算机视觉】基于OpenCV的人脸识别
一点背景知识 OpenCV 是一个开源的计算机视觉和机器学习库.它包含成千上万优化过的算法,为各种计算机视觉应用提供了一个通用工具包.根据这个项目的关于页面,OpenCV 已被广泛运用在各种项目上,从 ...