<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<html>

<head>

<script type="text/javascript" src="jQuery.js"></script>

</head>

<title>

</title>

    <style type="text/css">

        #menu {width:300px;}

        .hasChildren {background:#555;color:#fff;sursor:pointer;}

        .hightLight  {color: #fff; background:green;}

        div{padding:0;margin:10px 0;}

        div a{background:#888;display:none;float:left;width:300px;}

    </style>

<body>

    <script type="text/javascript">

    $(document).ready(

       function(){

        $(".hasChildren").click(

            function()

            {

                $(this).addClass("hightLight");

                $(this).children("a").show();

                $(this).siblings().removeClass("hightLight");

                $(this).siblings().children("a").hide();

            }

         );

    });

    </script>

    <div id="menu">

        <div class="hasChildren">

            <span>第一章</span>

            <a>---第一节</a>

            <a>---第二节</a>

        </div>

        <div class="hasChildren">

            <span>第二章</span>

            <a>---第一节</a>

            <a>---第二节</a>

        </div>

    </div>

</body>

</html>

jquery的几个小例子的更多相关文章

  1. php+jquery+ajax+json简单小例子

    直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...

  2. bootstrap 模态 modal 小例子

    bootstrap 模态 modal  小例子 <html> <head> <meta charset="utf-8" /> <title ...

  3. 【zTree】 zTree使用的 小例子

    使用zTree树不是第一次了  但是 还是翻阅着之前做的 对照着 使用起来比较方便  这里就把小例子列出来   总结一下使用步骤 这样方便下次使用起来方便一点 使用zTree树的步骤: 1.首先  在 ...

  4. bootstrap 模态 modal 小例子【转】

    bootstrap 模态 modal  小例子 <html> <head> <meta charset="utf-8" /> <title ...

  5. springmvc入门的第一个小例子

    今天我们探讨一下springmvc,由于是初学,所以简单的了解一下 springmvc的流程,后续会持续更新... 由一个小例子来简单的了解一下 springmvc springmvc是spring框 ...

  6. java即时通信小例子

    学习java一段时间了,今天写来一个即时通信的小例子练手在其过程中也学到了一些知识拿出来和大家分享,请路过的各位大神多多赐教... 好了下面讲一下基本的思路: 首先,编写服务器端的程序,简单点说吧就是 ...

  7. Runtime的几个小例子（含Demo）

    一.什么是runtime(也就是所谓的“运行时”,因为是在运行时实现的.)           1.runtime是一套底层的c语言API(包括很多强大实用的c语言类型,c语言函数);  [runti ...

  8. INI配置文件分析小例子

    随手写个解析INI配置字符串的小例子 带测试 #include <iostream> #include <map> #include <string> #inclu ...

  9. JavaScript小例子：复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

随机推荐

  1. Handler具体解释系列(四)——利用Handler在主线程与子线程之间互发消息

    MainActivity例如以下: package cc.c; import android.app.Activity; import android.os.Bundle; import androi ...

  2. 最新Connectify注冊码(序列号) Connectify3.7序列号 破解版

    Connectify序列号.最新注冊码 今天给大家公布一个Connectify最新版的序列号(注冊码) 今天给大家公布一个Connectify最新版的序列号(注冊码) 经本人測试该注冊码为最新版Con ...

  3. Delphi Memo的记事本功能

    Delphi Memo的记事本功能           下载地址 : http://download.csdn.net/detail/teststudio/6412883 这个代码实现了Windows ...

  4. Assigning retained object to unsafe property;object will be released after assignment

    解决方法,将变量 @property (assign) UILabel *titleView; 改为 @property (retain) UILabel *titleView;

  5. The Arduino IDE(compiler)'s float bug

    1.通常直接使用串口的print函数就ok Serial.println(DHT.humidity);  //assuming DHT.humidity is float 2.但是习惯问题,还是偏好s ...

  6. alloc、init你弄懂50%了吗？

    前言 这是一篇我记录对alloc.init分析思考的笔记.如果读者想看懂我的第二个思考,可能需要您至少了解内存的分段分页管理,如果您对其一点都不知道,可以先看这篇软文简单了解一下.另外很重要的一点是, ...

  7. ref和out的区别在c#中 总结

     ref 关键字使参数按引用传递.其效果是,当控制权传递回调用方法时,在方法中对参数所做的任何更改都将反映在该变量中.简单点说就是,使用了ref和out的效果就几乎和C中使用了指针变量一样.它能够让你 ...

  8. Java设计模式01：设计模式的 分类 和 设计原则

    一.总体来说设计模式分为三大类: 创建型模式:对象的创建. 创建对象本身是比较耗时的操作,所以我们这里专门找人来帮我们创建对象,我们根据经验总结出来的设计成熟的思路模式. 结构型模式:对象的组成(结构 ...

  9. jQuery失去焦点的时候注册验证

    //注册验证$('form :input').blur(function () { if ($("#txtName").val() == "") { $(&qu ...

  10. TCP与UDP区别

    原文链接:http://blog.sina.com.cn/s/blog_493309600100clrw.html TCP与UDP区别 TCP---传输控制协议,提供的是面向连接.可靠的字节流服务.当 ...