Jquery | 基础 | 事件的链式写法
$(".title").click(function () {
$(this).addClass("curcol").next(".content").css("display", "block");
});
<!DOCTYPE html>
<html> <head>
<title>jQuery事件的链式写法</title>
<script src="jquery-3.3.1.min.js" type="text/javascript"></script>
<style type="text/css">
.iframe {
border: solid 1px #888;
font-size: 13px;
} .title {
padding: 6px;
background-color: #EEE;
} .content {
padding: 8px 0px;
font-size: 12px;
text-align: center;
display: none;
} .curcol {
background-color: #CCC
}
</style>
<script type="text/javascript">
$(function () {
$(".content").html("您好！欢迎来到jQuery的精彩世界。");
$(".title").click(function () {
$(this).addClass("curcol").next(".content").css("display", "block");
});
});
</script>
</head> <body>
<div class="iframe">
<div class="title">标题</div>
<div class="content"></div>
</div>
</body> </html>
当页面首次加载时，被包含的内容<div> 标记是不可见的，当用户单击主题<div> 标记时，改变自身的背景色，并将内容<div> 标记显示出来。
Jquery | 基础 | 事件的链式写法的更多相关文章
- JQuery事件的链式写法
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- jquery事件链式写法
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...
- jQuery插件编写及链式编程模型
jQuery插件编写及链式编程模型小结 JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我 ...
- Delphi Sysem.JSON 链式写法（转全能中间件）
链式写法有很多优点:连贯.语意集中.简洁.一气呵成.可读性强.比如要把 3.1415926 中的 59 提取为一个整数:Pi.ToString().Substring(5,2).ToInteger() ...
- Hadoop基础-Map端链式编程之MapReduce统计TopN示例
Hadoop基础-Map端链式编程之MapReduce统计TopN示例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.项目需求 对“temp.txt”中的数据进行分析,统计出各 ...
- ajax操作的链式写法
ajax操作的传统写法: $.ajax({ url: url, success: function(){ doWhenSuccess(); }, error: function(){ doWhenEr ...
- Java 链式写法
Java链式写法,子类继承父类的属性,也可以返回子类的对象,只是需要重写基类的Set方法 public class MyLS { public static void main(String[] ar ...
- Delphi Sysem.JSON 链式写法
链式写法有很多优点:连贯.语意集中.简洁.一气呵成.可读性强.比如要把 3.1415926 中的 59 提取为一个整数:Pi.ToString().Substring(5,2).ToInteger() ...
- Java链式写法
原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11613067.html Java 链式写法:详细看代码 package chain; /** ...
随机推荐
- ZOJ - 3932 Handshakes 【水】
题目链接 http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3932 题意 给出 N 个人,然后 1-N 然后 从 1 - N ...
- ZOJ - 3950 How Many Nines 【前缀和】
题目链接 http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3950 题意 给出两个日期 求 这个日期 经过 到 另外一个日期 ...
- angularjs ng-repeat倒叙
<div ng-app="myApp" ng-controller="customersCtrl"> <table> <tr ng ...
- codeforces 509 B题 Painting Pebbles
转载地址:http://blog.csdn.net/nike0good/article/details/43449739 B. Painting Pebbles time limit per test ...
- UVA11752 The Super Powers —— 数论、枚举技巧
题目链接:https://vjudge.net/problem/UVA-11752 题意: 一个超级数是能够至少能表示为两个数的幂,求1~2^64-1内的超级数. 题解: 1.可知对于 n = a^b ...
- postNotificationName 消息传递详解
1.定义消息创建的关联值 也就是找到方法的标志 NSString *const GameToIPhoneNotification = @"GameToIPhoneNotification ...
- SQL.py
import sqlite3,sys def convert(value): if value.startswith('~'): return value.strip('~') if not valu ...
- 「LuoguP3796」 【模板】AC自动机（加强版）
题目描述 有N个由小写字母组成的模式串以及一个文本串T.每个模式串可能会在文本串中出现多次.你需要找出哪些模式串在文本串T中出现的次数最多. 输入输出格式 输入格式: 输入含多组数据. 每组数据的第一 ...
- 【servlet学习1】使用eclipse+tomcat开发servlet示例
零.开发环境 1.eclipse+tomcat(tomcat插件已安装到eclipse中). 一.开发servlet步骤 1.在eclipse中新建工程 File —> New —> Ot ...
- CSS3：CSS 听觉参考手册
ylbtech-CSS3:CSS 听觉参考手册 1.返回顶部 1. 听觉样式表 听觉样式表可把语音合成与音响效果相组合,使用户可以听到信息,而无需进行阅读. 听觉呈现可用于: 视觉能力低弱的人士 帮助 ...