<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title></title>

    <style type="text/css">

        .panle {

            padding: 60px;

            background-color: red;

            color: #fff;

            font-size: 50px;

            font-weight: bold;

            width: 600px;

            text-align: center;

        }

    </style>

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

    <script type="text/javascript">

        $(function(){

            //第一行代码，在文档中添加四个按钮

            $('<input type="button" value="click me"/><input type="button" value="triggle click me"/><input type="button" value="detach handler"/><input type="button" value="show/hide text"/>').appendTo($('body'));

            //第二行代码,分别选中四个按钮，并为它们绑定不同的时间处理函数

            $('input[type="button"]').eq(0).click(function(){//找到第一个按钮，并绑定click事件处理函数

                alert('you clicked me!');

            }).end().eq(1)    //返回所有按钮，再找到第二个

            .click(function(){ //为第二个按钮绑定click事件处理函数

                $('input[type="button"]:eq(0)').trigger('click');

            }).end().eq(2)    //返回所有按钮，再找到第三个

            .click(function(){    //为第三个按钮绑定click事件处理函数

                $('input[type="button"]:eq(0)').unbind('click');

            }).end().eq(3)    //返回所有按钮，再找到第四个

            .toggle(function(){    //为第四个按钮绑定toggle事件处理函数

                $('.panel').hide('slow');

            },function(){

                $('.panel').show('slow');

            });

        });

    </script>

</head>

<body>

    <div class="panel">welcome to jquery!</div>

</body>

</html>

jquery链式语法的更多相关文章

  1. jQuery链式语法演示

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

  2. jquery html标签的链式语法

    <div id="ProductNet"> <table border='0' cellspacing='2' cellpadding='0' style='te ...

  3. javascript链式语法

    因为 jQuery 库的缘故,链式语法在前端界变得非常流行.实际上这是一种非常容易实现的模式.基本上,你只需要让每个函数返回 'this',这样其他函数就可以立即被调用.看看下面的例子. var bi ...

  4. 如何在Objective-C中实现链式语法

    在接触到开源项目 Masonry 后,里面的布局约束的链式写法让我颇感兴趣,就像下面这样: 1 2 3 4 5 6 7 8 UIEdgeInsets padding = UIEdgeInsetsMak ...

  5. jQuery链式操作

    讨论jQuery的文章很多.然而,关于jQuery的链式操作的文章并无多少.好的代码会带来速度的提升.快速渲染和响应意味着更好的用户体验. 下面就来讲讲jQuery的链式操作. 很多时候我们写代码的时 ...

  6. 如何在Objective-C中实现链式语法？

    在接触到开源项目 Masonry 后,里面的布局约束的链式写法让我颇感兴趣,就像下面这样: 1 2 3 4 5 6 7 8 UIEdgeInsets padding = UIEdgeInsetsMak ...

  7. JQUERY链式操作实例分析

    本文实例讲述了jQuery链式操作.分享给大家供大家参考,具体如下: 从过去的实例中,我们知道jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <scri ...

  8. jQuery链式操作[转]

    用过jQuery的朋友都知道他强大的链式操作,方便,简洁,易于理解,如下 $("has_children").click(function(){ $(this).addClass( ...

  9. 模拟jquery链式访问

    一直写代码写代码,博客都快荒废了,眼看一月要过完,不能不留下点记忆,嘿嘿,刚研究了下jquery的链式访问,这么好用的技能我赶紧get了下,研究后略微修改,模拟一个简单的链式访问,下面这段代码支持修改 ...

随机推荐

  1. STL学习笔记（仿函数）

    仿函数(Functors) 仿函数(functor),就是使一个类的使用看上去象一个函数.其实现就是类中实现一个operator(),这个类就有了类似函数的行为,就是一个仿函数类了. 例如我们定义一个 ...

  2. 【JQuery Easy UI】后台管理系统的简单布局分享

    重要说明:本博已迁移到 石佳劼的博客.有疑问请到 文章新地址 留言..! 近期做的一个简单的后台管理系统,当中用到了JQuery Easy UI框架,对于撸主这样的把控件能摆整齐就谢天谢地的码农来说, ...

  3. quick-cocos2d-x3.2 scheduler使用注意事项

    近期在使用scheduler时发现例如以下问题 调用: local scheduler = require(cc.PACKAGE_NAME .. ".scheduler") fun ...

  4. Linux的文件传输命令总结

    由于工作原因,须要常常在不同的server见进行文件传输,特别是大文件的传输,因此对linux下不同server间传输数据命令和工具进行了研究和总结.主要是rcp,scp,rsync,ftp,sftp ...

  5. java中利用WeakHashMap实现缓存

    简介 WeakHashMap是Java集合框架里的一员,从名字可以看出它是某种 Map.它的特殊之处在于 WeakHashMap 里的entry可能会被GC自动删除,即使程序员没有调用remove() ...

  6. Gmail收不到邮件咋办？

    http://www.ipip.net/ping.php 分别输入 imap.gmail.com pop.gmail.com smtp.gmail.com 选择  国外 , 然后点ping,找到对应的 ...

  7. ListView中CheckBox使用问题

    因为CheckBox的点击事件优先级比ListView的高,所以当ListView中使用CheckBox会导致ListView的setOnItemClickListener失去响应. 解决的方法:在C ...

  8. Linux安装php-7.0.16，完成php和apache的配置

    Linux安装php-7.0.16,完成php和apache的配置     版本:php-7.0.16.tar.gz,libxml2-2.9.2.tar.gz(php需要它的支持,首先安装它) 说明 ...

  9. 改进Spring中的分页技术

    Spring中有一个PagedListHolder,能够实现分页. 但此类有几个缺点: 1. 使用此类的代码比較繁琐 2. 此类存放的数据源是全部的记录集,即对于记录数为1000条的数据,即使我们仅仅 ...

  10. UserScan的处理流程分析

    UserScan的处理流程分析 前置说明 Userscan是通过client或cp中发起的scanner操作. 在Scan中通过caching属性来返回能够返回多少条数据.每次进行next时. 通过b ...