jQuery效果--隐藏和显示
jQuery hide() 和 show()
通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
})；
语法：
$(selector).hide(speed,callback); $(selector).show(speed,callback);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
下面的例子演示了带有 speed 参数的 hide() 方法：
实例
$("button").click(function(){
$("p").hide(1000);
});
jQuery toggle()
通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
显示被隐藏的元素，并隐藏已显示的元素：
实例
$("button").click(function(){
$("p").toggle();
});
语法：
$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。
代码：
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").toggle();
});
});
</script>
</head>
<body>
<button type="button">切换</button>
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
</body>
</html>
另一种方式：
我设置同一个按扭给它设置两个点击事件，一个是点击隐藏，还有一个是双击显示一秒延迟，当然你也可以用一个方法，看个人喜好，我这里这么写只是为了测试代码，因为可能使用的外部JQuery的文件不一样，所以这里请您自行引入
code：
<script type="text/javascript">
$(document).ready(function() {
$("#btn1").click(function() {
//点击会隐藏
$("p").hide();
});
$("#btn1").dblclick(function(){
//在隐藏完成后双击显示，一秒延迟
$("p").show(1000);
})
});
</script>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button" id="btn1">BTN1</button>
</body>
jQuery效果--隐藏和显示的更多相关文章
- jQuery 效果 —— 隐藏和显示
jQuery 效果 -- 隐藏和显示 1.隐藏和显示 (1)在jQuery中我们可以使用hide()和show()分别隐藏和显示HTML元素: //隐藏元素 $("button") ...
- jQuery 效果 - 隐藏和显示
$('...').hide();//隐藏 $('...').show();//显示 以上使用需要针对特定的功能单独使用,如果是混用,那么就要有标志位去实现,而通常两者更高级的一步到位实现: $('.. ...
- jQuery效果---隐藏与显示
隐藏与显示 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- jQuery 效果 – 隐藏和显示
在 jQuery 中可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素,以及使用 toggle() 方法能够切换 hide() 和 show() 方法. 隐藏.显示.切换,滑动 ...
- jQuery效果------隐藏hide()/显示show()
hide()和show() hide():隐藏文本. show():显示文本. 语法: $(selector).hide(speed,callback); $(selector).show(speed ...
- jQuery效果-隐藏与显示 小方块的移除
html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...
- JQuery效果隐藏/显示
hide() 方法 语法 $(selector).hide(speed,callback) show() 方法 语法 $(selector).show(speed,callback) 参数 描述 sp ...
- jquery02-jQuery效果=隐藏和显示+切换+淡入淡出+滑动+动画+回调+链
隐藏和显示 $(selector).hide(speed,callback); $(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度, ...
- jQuery_效果(隐藏和显示)
一.jQuery hide() 显示和 show()隐藏 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: <script type=" ...
随机推荐
- 二、Spring Boot 中maven中dependencies所有的jar包都报红，install报错(https://repo.maven.apache.org/maven2): Not authorized , ReasonPhrase:Authorizatio
问题一:现象:打开SpringBoot项目后,所有依赖包都报红色波浪线 1.install报错(https://repo.maven.apache.org/maven2): Not authorize ...
- JS字符串转换为JSON的方法
1.jQuery插件支持的转换方式: 示例: $.parseJSON( jsonstr ); //jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象 2.浏览 ...
- stm8问题记录
sprintf 错误 现象:打印不出来数字 需要包含#include<stdio.h>
- Postman系列之测试用例管理(二)
实验简介 本文主要讲解Postman对多个测试用例的管理,让测试进行更有序,易于管理. 实验目的 Postman 测试集(Collections)管理的相关内容,它用来保存我们的 Request ,可 ...
- 阶段3 3.SpringMVC·_04.SpringMVC返回值类型及响应数据类型_3 响应之返回值是void类型
定义先的标签 返回void 测试默认的跳转 虽然是404但是方法执行了. 默认请求了 testVoid.jsp这个页面.请求路径叫什么 就访问哪个jsp页面. 使用request请求转发 抛出的异常 ...
- 非UI线程更新UI界面的各种方法小结
转载:https://www.cnblogs.com/xiashengwang/archive/2012/08/18/2645541.html 我们知道只有UI线程才能更新UI界面,其他线程访问UI控 ...
- mariadb数据库集群
1.主从架构: 每个从节点需要一个dump线程连接主节点 异步:效率高,安全性低,有延迟 同步:效率低,安全性高,无延迟 主:可读可写,(dump thread) 从:可读不可写 (sql threa ...
- 【Linux开发】linux设备驱动归纳总结（三）：6.poll和sellct
linux设备驱动归纳总结(三):6.poll和sellct xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx ...
- vue中 Vue.set 的使用
Vue.set(vm.items, indexOfItem, newValue) 1.vm.items :源数据:2.indexOfItem : 要修改的数据的键3.newValue : 要修改的数据 ...
- grep与正则表达式：
1.grep程序 Linux下有文本处理三剑客 -- grep sed awk grep:文本 行过滤工具 sed: 文本 行编辑器(流编辑器) awk:报告生成器(做文本输出格式化) grep ...