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") ...
随机推荐
- Flutter AspectRatio、Card 卡片组件
Flutter AspectRatio 组件 AspectRatio 的作用是根据设置调整子元素 child 的宽高比. AspectRatio 首先会在布局限制条件允许的范围内尽可能的扩展,widg ...
- SpringBoot配置加载顺序
一般我们会将SpringBoot应用需要的配置内容放在项目工程中,然后通过spring.profiles.active或是通过Maven来实现多环境的支持.但是,当团队逐渐壮大,分工越来越细之后,往往 ...
- pytorch transforms.Lambda的使用
当你想要对图像设置transforms策略时,如: from torchvision import transforms as T normalize = T.Normalize([0.485, 0. ...
- asp中出现“错误 '80040e14' FROM 子句语法错误”原因
当你的sql语句中出现 “错误 '80040e14' FROM 子句语法错误.”错误时,请注意了,那有可能是你的表名的命名不规范造成的,比如你的表名是“user”那么这杨的表名是不行的,那么在sql语 ...
- java 读取CSV数据并写入txt文本
java 读取CSV数据并写入txt文本 package com.vfsd; import java.io.BufferedWriter; import java.io.File; import ja ...
- linux安装6.5.3版本elastic search
到官网https://www.elastic.co/cn/downloads/elasticsearch下载压缩包,目前最新的版本是7.3.2,我想下6.5.3,点击下面的past release链接 ...
- 123457123456#2#----com.MC.HuiHuaGame33--前拼后广--画画填色Game-mc
com.MC.HuiHuaGame33--前拼后广--画画填色Game-mc
- yarn那些事儿
本篇文章立足于mac. 一.安装yarn 1.通过homebrew brew update brew install yarn 2.通过脚本 curl -o- -L https://yarnpkg.c ...
- 07点睛Spring MVC4.1-ContentNegotiatingViewResolver
转发地址:https://www.iteye.com/blog/wiselyman-2214965 7.1 ContentNegotiatingViewResolver ContentNegotiat ...
- soapui教程
简介 SOAPUI,一款专业的web service的测试软件,SoapUI也是一个开源测试工具,通过soap/http来检查.调用.实现Web Service的功能/负载/符合性测试.该工具既可作为 ...