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") ...
随机推荐
- 从0开始学爬虫8使用requests/pymysql和beautifulsoup4爬取维基百科词条链接并存入数据库
从0开始学爬虫8使用requests和beautifulsoup4爬取维基百科词条链接并存入数据库 Python使用requests和beautifulsoup4爬取维基百科词条链接并存入数据库 参考 ...
- stl中map的四种插入方法总结
stl中map的四种插入方法总结方法一:pair例:map<int, string> mp;mp.insert(pair<int,string>(1,"aaaaa&q ...
- jenkins--master/slave模式---master是容器版---slave是非容器版
实验架构: 192.168.0.96 gitlab 192.168.0.97 jenkins.tomcat 192.168.0.98 harbor.docker集群.git.jdk.maven 1.先 ...
- 静态站点生成器-md-hexo
推荐指数:
- linq list select用法注意事项
下面是我自己做的一个例子 List<CR_CustomerOrder> OrdList = new List<CR_CustomerOrder>(); var b = OrdL ...
- 关于css清除元素浮动的方法总结（overflow clear floatfix）
在前两天的一个面试中考官问我web中清除浮动的一些css常用方法,我很轻松的答出了: 1.overflow:hidden 2.clear:both 3.floatfix类 然后问题就来了,考官接着问' ...
- Tomcat教程（转）
转载链接: https://www.cnblogs.com/jingmoxukong/p/8258837.html?utm_source=gold_browser_extension 简介 Tomca ...
- HashMap的key存储对象需要注意哪些
HashMap的key最好不要存储对象,大部分环境都是String. 如果要存储对象,要注意重写下equal和hashcode方法!!
- Google大数据三大论文
简介:https://blog.csdn.net/w1573007/article/details/52966742 论文中英文版下载http://pan.baidu.com/s/1slUy4sl ...
- [转帖]K8s 工程师必懂的 10 种 Ingress 控制器
K8s 工程师必懂的 10 种 Ingress 控制器 https://www.kubernetes.org.cn/5948.html 控制器有好多啊. 2019-10-18 23:07 中文社区 分 ...