<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title> Hello JQuery</title>
    <script  lang ="javascript" type ="text/javascript" src ="JQuery/jquery-2.1.0.min.js"> 
    </script>
    <style type ="text/css">
        .divFrm {
            width:300px;border: 2px solid #625d5d; font-size:12px;
        }
        .divTitle {
            background-color:#08fcfc;padding :5px;
        }
        .divContent {
            padding:5px;display:none;
        }
        .divCurrColour {
            background-color:red;
        }
    </style>
</head>
<body>
     <!-- 添加jquery的引用文件-->
    <script type ="text/javascript">
        $(function () {
            $(".divTitle").click(function () {
                $(this).addClass("divCurrColour")
                    .next(".divContent").css("display", "block")
            });
        });
    </script>
     <div class = "divFrm">
       <div class ="divTitle"> 主题</div>
       <div class ="divContent">
           <a href="http://baidu.com">链接一</a><br />
           <a href="http://jquery.com">链接二</a><br />
           <a href="http://www.google.com/">链接三</a>
           <!-- <a></a> 链接的标记字段-->
       </div>
     </div>
</body>
</html>

说明:

中间红色的为事件的链式写法,实现两个事件:

1、改变 <div class ="divTitle"> 主题</div> 的颜色

2、显示   <div class ="divContent">

中间通过.next链接起来

jquery事件链式写法的更多相关文章

  1. JQuery事件的链式写法

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

  2. Jquery | 基础 | 事件的链式写法

    $(".title").click(function () { $(this).addClass("curcol").next(".content&q ...

  3. jquery中链式操作的this指向

    jquery中链式操作是如何实现? 例如:$(obj).children().css('color','red').next().css('color','red').siblings().css(' ...

  4. Delphi Sysem.JSON 链式写法(转全能中间件)

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

  5. ajax操作的链式写法

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

  6. jQuery支持链式编程,一句话实现左侧table页+常用筛选器总结

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  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. jQuery的链式编程风格

    jQuery的链式编程风格 首先本人通过一个案例来展示jQuery的链式编程风格.先写一个页面,展示一个列表,代码如下: <body> <div> <ul class=& ...

随机推荐

  1. cocos2dx 字体

    有些时候需要在界面上显示些文字,自然涉及到字体的问题 显示文字使用CCLabelTTF即可,创建方法是 CCLabelTTF(const char* text, const char* font, i ...

  2. mirantis cert

    with no vendor specificity and/or proprietary implementations,没有供应商的特异性和/或专有的实现 https://training.mir ...

  3. hbase0.96 put流程 源码分析

    无意间多瞄了一眼hbase0.98的代码,想复习下put流程.发现htable里面已经找不到processBatchOfPuts()奇怪了.看了半天原来变化还真大事实上0.96就没这个了,于是又搞了个 ...

  4. Android UI设计

    Android UI设计--PopupWindow显示位置设置 摘要: 当点击某个按钮并弹出PopupWindow时,PopupWindow左下角默认与按钮对齐,但是如果PopupWindow是下图的 ...

  5. C标准中一些预定义的宏

    C标准中指定了一些预定义的宏,对于编程经常会用到.下面这个表中就是一些常常用到的预定义宏. 宏(双下滑线) 意义 __DATE__ 进行预处理的日期(“Mmm dd yyyy”形式的字符串文字) __ ...

  6. ubuntu16.04安装kde桌面出错: /var/cache/apt/archives/kde-config-telepathy-accounts_4%3a15.12.3-0ubuntu1_amd64.deb

    出错提示: 正在读取软件包列表... 完成 正在分析软件包的依赖关系树 正在读取状态信息... 完成 kubuntu-desktop 已经是最新版 (1.338). 您可能需要运行“apt-get - ...

  7. 使用iscroll4可能会遇到的问题(转:记录)

    1.在iscroll4的滚动容器范围内,点击input框.select等表单元素时没有响应这个问题原因在于iscroll需要一直监听用户的touch操作,以便灵敏的做出对应效果,所以它把其余的默认事件 ...

  8. XHTML CSS 常见问题和解决方案

    原文地址:XHTML CSS 常见问题和解决方案 作为前端开发人员,在日常的页面制作时,不可避免的会碰上这样那样的问题,我挑选了其中的一些进行总结归档,希望对大家会有所帮助: 1.如何定义高度很小的容 ...

  9. [LeetCode]题解(python):069-Sqrt(x)

    题目来源: https://leetcode.com/problems/sqrtx/ 题意分析: 实现一个整型的开根. 题目思路: 利用牛顿迭代法可以求解.首先讲数据类型转成浮点数,然后选取初始值为n ...

  10. python -- 计算数学题--用程序解决问题1

    1.#一个四位数,各位数字互不相同,所有数字之和等于6,并且这个数是11的倍数,#则满足这种要求的四位数有多少个? 代码如下: # -*- coding: UTF-8 -*-import systyp ...