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 中SimpleDialog简单弹窗使用
import 'package:flutter/material.dart'; import 'dart:async'; enum Option { A, B, C } class SimpleDia ...
- Spring的@ExceptionHandler和@ControllerAdvice统一处理异常
之前敲代码的时候,避免不了各种try..catch, 如果业务复杂一点, 就会发现全都是try…catch try{ ..........}catch(Exception1 e){ ......... ...
- wpf日期控件
/// <summary> /// Value converter to convert a datetime object to the specified string format. ...
- Linux记录-Shell自动化部署批量建立用户和批量SSH配置（转载）
if [ ! $# -eq 2 ] ; then echo "请输入用户名和密码以空格分开!" exit else name="$1" passwd=" ...
- Django:将后台返回的数据填充到select下拉框中
select选择框如下: <select data-placeholder="选择项目..." class="form-control" name=&qu ...
- http响应时长分析
curl -o /dev/null -s -w "time_namelookup:%{time_namelookup}::time_connect:%{time_connect}::time ...
- SPSS 2019年10月17日 21:46:38 今日学习总结
数据库: 开放数据库链接是为了解决异构数据库间的数据共享而产生的,现已成为WOSA的主要部分和基于Windows环境的一种数据库访问接口标准ODBC为异构数据库访问提供一个接口,允许应用程序以SQL为 ...
- orleans 的一种模式
为了避免过热的grain,按时间%cpu数,分派任务到grain中,然后有限制的去访问原来过热的grain.eg:tokengrain,1个半小时后,更新所有的grain.
- Linux如何查看进程、杀死进程、启动进程
1.查看进程:ps命令 下面的命令还没实践,仅仅供你参考:可以用man ps查看格式,只不过是一个小工具而已! ps a 显示现行终端机下的所有程序,包括其他用户的程序. ps -A 显示所有程 ...
- Ubuntu 软件卸载脚本（卸载软件 + 移除配置文件 + 移除依赖项）
#!/bin/bash function z-apt-uninstall() { if [ ! $1 ] then echo "z-apt-uninstall error: software ...