<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

<style>

* {margin:0;padding:0;}

.accordion {width:500px;height:auto;border:solid 1px #ccc;}

.accordion dt {padding:10px;border-bottom:solid 1px #ccc;font:bold 14px/16px 微软雅黑;color:#444;background:#eee;}

.accordion dd {padding:8px 10px;font:12px/16px 微软雅黑;color:#999;border-bottom:solid 1px #ccc;}

</style>

</head>

<body>

<dl class="accordion" id="my">

      <dt>方法合并 1</dt>

        <dd>jQuery 的 $.extend 方法合并两个或多个对象</dd>

      <dt>方法合并 2</dt>

        <dd>jQuery 的 $.extend 方法合并两个或多个对象</dd>

      <dt>方法合并 3</dt>

        <dd>jQuery 的 $.extend 方法合并两个或多个对象</dd>

      <dt>方法合并 4</dt>

        <dd>jQuery 的 $.extend 方法合并两个或多个对象</dd>

</dl>

<script>

    (function($){

        $.fn.accordion = function(options){

            return this.each(function(){

                var dts = $(this).children('dt');

                dts.click(onClick);

                dts.each(reseter);

            });

            function onClick () {

                $(this).siblings('dt').each(hide);

                $(this).next().slideDown("fast");

                return false;

            }

            function hide (){

                $(this).next().slideUp("fast");

            }

            function reseter(){

                $(this).next().hide();

            }

        };

    })(jQuery);

    $('#my').accordion();

</script>

</body>

</html>

方法合并 1
jQuery 的 $.extend 方法合并两个或多个对象
方法合并 2
jQuery 的 $.extend 方法合并两个或多个对象
方法合并 3
jQuery 的 $.extend 方法合并两个或多个对象
方法合并 4
jQuery 的 $.extend 方法合并两个或多个对象

学了一个封装的jquery插件，感觉还成的更多相关文章

  1. 推荐一个内容滚动jquery插件

    myslider是一个内容滚动jquery插件,版本0.1.2的每次滚动内容是一行内容,可以是文字,可以是一个链接,还可以是图片. 官方网址:http://keleyi.com/jq/myslider ...

  2. 编写一个简单的Jquery插件

    1.实现内容 定义一个简单的jquery插件,alert传递进来的参数 2.插件js文件(jquery.showplugin.js) (function ($) { //定义插件中的方法 var me ...

  3. 制作一个简洁的jquery插件

    原文:http://mp.weixin.qq.com/s?__biz=MzAxMzgwNDU3Mg==&mid=401571467&idx=1&sn=08cb00963e6ef ...

  4. 封装第三方jquery插件

    需要自己编写 directives 的情况通常是当你使用了第三方的 jQuery 插件.因为插件在 AngularJS 之外对表单值进行更改,并不能即时反应到 Model 中.例如我们用得比较多的 j ...

  5. How to Create a Basic Plugin 如何写一个基础的jQuery插件

    How to Create a Basic Plugin Sometimes you want to make a piece of functionality available throughou ...

  6. 【前端】制作一个handlebars的jQuery插件

    (function($) { var compiled = {}; $.fn.handlebars = function($srcNode, data) { // 取出模版内容 var src = $ ...

  7. 图片延迟加载并等比缩放，一个简单的JQuery插件

    使用方法: $(".viewArea img").zoom({height:74,width:103}); (function($){ $.fn.zoom = function(s ...

  8. 一个不错的jquery插件模版

    pageplugin.js (function ($) { $.PagePlugin = function (obj, opt) { var options = $.extend({}, $.Page ...

  9. 50个jQuery插件可将你的网站带到另一个高度

    Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好 ...

随机推荐

  1. 【干货】.NET开发通用组件发布（二） 邮件发送组件

    组件介绍和合作开发 http://www.cnblogs.com/MrHuo/p/MrHuoControls.html 邮件发送组件 邮件发送组件采用常用的SMTP发送方式,需要添加以下格式的配置文件 ...

  2. JS 多种变量定义

    对象直接量创建一个对象:  var obj = {x:[1,2],y:23}; 代码跟下面是一样的.  var obj=new Object(); obj.x=new Array(1,2); obj. ...

  3. Word2Vec之Deep Learning in NLP （一）词向量和语言模型

    转自licstar,真心觉得不错,可惜自己有些东西没有看懂 这篇博客是我看了半年的论文后,自己对 Deep Learning 在 NLP 领域中应用的理解和总结,在此分享.其中必然有局限性,欢迎各种交 ...

  4. #Java编程题-百钱百鸡

    问题: 百钱百鸡问题.用100钱买100只鸡,公鸡一只五钱,母鸡一只三钱,雏鸡三只一钱,编程计算共有几种买法(要求每种鸡至少要买1只). 自己的实现,没有什么数据结构,算法,求大神指点!! packa ...

  5. 几种TCP连接中出现RST的情况

    http://blog.chinaunix.net/uid-24517549-id-3991141.html http://blog.chinaunix.net/uid-24517549-id-399 ...

  6. Codeforces 372B Counting Rectangles is Fun

    http://codeforces.com/problemset/problem/372/B 题意:每次给出一个区间,求里面有多少个矩形 思路:预处理,sum[i][j][k][l]代表以k,l为右下 ...

  7. try...catch...finally中try块发生的事件顺序

    1.try块在发生异常的地方中断程序的执行.2.如果有catch块,就检查该块是否匹配已抛出的异常类型.如果没有catch块,就执行finally块(如果没有catch块,就一定要有finally块) ...

  8. A51汇编器的解释

    A51汇编器是运行于IBM PC系列及其兼容机上的交叉汇编软件,其主要功能是将MCS-51系列单片机汇编语言源程序翻译成符合Intel目标文件格式的可再定位的目标代码,经过L51连接器的连接和装配,产 ...

  9. log4net logfornet 配置和用法

    较好的参考地址: http://in3040.blog.163.com/blog/static/116702443201091354028744/ http://dev.tot.name/dotnet ...

  10. POJ 2182 Lost Cows (线段树)

    题目大意: 有 n 头牛,编号为 1 - n 乱序排成一列,现已知每头牛前面有多少头牛比它的编号小,从前往后输出每头牛的编号. 思路: 从后往前推,假如排在最后的一头牛比他编号小的数量为a,那么它的编 ...