$(".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 | 基础 | 事件的链式写法的更多相关文章

  1. JQuery事件的链式写法

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. jquery事件链式写法

    <!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  3. jQuery插件编写及链式编程模型

    jQuery插件编写及链式编程模型小结 JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我 ...

  4. Delphi Sysem.JSON 链式写法（转全能中间件）

    链式写法有很多优点:连贯.语意集中.简洁.一气呵成.可读性强.比如要把 3.1415926 中的 59 提取为一个整数:Pi.ToString().Substring(5,2).ToInteger() ...

  5. Hadoop基础-Map端链式编程之MapReduce统计TopN示例

    Hadoop基础-Map端链式编程之MapReduce统计TopN示例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.项目需求 对“temp.txt”中的数据进行分析,统计出各 ...

  6. ajax操作的链式写法

    ajax操作的传统写法: $.ajax({ url: url, success: function(){ doWhenSuccess(); }, error: function(){ doWhenEr ...

  7. Java 链式写法

    Java链式写法,子类继承父类的属性,也可以返回子类的对象,只是需要重写基类的Set方法 public class MyLS { public static void main(String[] ar ...

  8. Delphi Sysem.JSON 链式写法

    链式写法有很多优点:连贯.语意集中.简洁.一气呵成.可读性强.比如要把 3.1415926 中的 59 提取为一个整数:Pi.ToString().Substring(5,2).ToInteger() ...

  9. Java链式写法

    原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11613067.html Java 链式写法:详细看代码 package chain; /** ...

随机推荐

  1. Linux集群基础

    Linux集群基础 作者:Danbo 时间:2015-7-12 集群概述 什么是集群?集群是一组协同工作的服务器实体.用以提供比单一服务实体更具扩展性和可用性的平台. 集群的分类 1.HPC(High ...

  2. Gym - 100676F Palindrome —— 并查集

    题目链接:https://vjudge.net/contest/155789#problem/E 题解: 由于是回文串,所以可以先将在对称位置的字符放在同一个集合(如果期间有两个非‘?’,且不相等,则 ...

  3. tableView滑动时cell消失

    最近做的工程中,出现个奇怪的问题吗,就是上下滑动tableView的时候,cell还未出屏幕就消失了,找了很久找到了原因,是因为界面中需要的cell有很多种,而有的cell的高度是一开始算出来或是固定 ...

  4. Git基本用法1

    二.git的初始化 在使用git进行代码管理之前,我们首先要对git进行初始化. 1.Git 配置 使用Git的第一件事就是设置你的名字和email,这些就是你在提交commit时的签名,每次提交记录 ...

  5. 从Inception v1,v2,v3,v4,RexNeXt到Xception再到MobileNets,ShuffleNet,MobileNetV2

    from:https://blog.csdn.net/qq_14845119/article/details/73648100 Inception v1的网络,主要提出了Inceptionmodule ...

  6. 关于Spring MVC分页

    使用Pageable接口,首先要实例化. 在servlet-context.xml中配置 <annotation-driven> <!-- 分页参数 --> <argum ...

  7. v-for指令用法二

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  8. (QA-LSTM)自然语言处理：智能问答 IBM 保险QA QA-LSTM 实现笔记.md

    train集: 包含若干条与保险相关的问题,每一组问题对为一行,示意如下: 可分为四项,第三项为问题,第四项为答案: 1.build_vocab 统计训练集中出现的词,返回结果如下(一个包含3085个 ...

  9. javascript之闭包，递归，深拷贝

    闭包 理解:a函数执行后return出b函数且b函数可以访问a函数的数据 好处:子函数存储在复函数内部,子函数执行完不会被自动销毁 坏处:占用内存比较大 ex: function bibao(){ v ...

  10. JavaScript 日期处理类库 moment

    可以自定义自己需要的时间格式,中文文档如下: http://momentjs.cn/ http://momentjs.cn/docs/