定义和用法

end() 方法结束当前链条中的最近的筛选操作，并将匹配元素集还原为之前的状态。

以上是官方说法，比较难理解。

还是用一个例子来说明

<!DOCTYPE html>

<html>

<head>

  <style>p { margin:10px; padding:10px; }</style>

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

</head>

<body>

  <p><span>Hello</span>, how are you?</p>

  <script>$("p").find("span").end().css("border", "2px red solid");</script>

</body>

</html>

$("p").find("span")表示查找P元素下的SPAN元素

但是我想更改P的边框，这时我就要返回到P元素（即从SPAN返回到P,就是还原为之前的状态)

$("p").find("span").end()这个语句就返回来了。

$("p").find("span").end().css("border", "2px red solid")把P的边框设置了。

-------------------

对于end()方法，jQuery文档是这样解释的：jQuery回到最近的一个"破坏性"操作 之前。即: 将匹配的元素列表变为前一次的状态。

    但给的例子并不是很明显，相信不少人并没有理解它的用法。

    下边我们以一个非常简单的例子来说明下用法，html代码如下：

<div id="test">

    <h1>jQuery end()方法</h1>

    <p>讲解jQuery中end()方法。</p>

</div>

JS代码：

$(document).ready(function() {

    $("#test").click(function() {

        $(this).find("p").hide().end().hide();

    });

});

点击id为test的div时，首先找到div里边的p标签，将其隐藏。接下来使用end()方法结束了对p标签的引用，此时返回的是#test(jQuery对象)，从而后边的hide()方法隐藏了div。这样相信大家已经理解了jQuery中end()方法。

----------------------

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

<script type="text/javascript">

<!--

    $(function(){

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

        $('input[type="button"]').eq(0).click(function(){

            alert('you clicked me!');

        })

        .end().eq(1).click(function(){

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

        })

        .end().eq(2).click(function(){

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

        })

        .end().eq(3).toggle(function(){

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

        },function(){

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

        });

    })

//-->

</script>

<style type="text/css">

    .panel{

        padding:20px;

        color:#FFFFFF;

        font-weight:bold;

        width:200px;

        height:50px;

    }

</style>

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

jQuery中的end()方法的更多相关文章

  1. jquery 中一些 特殊方法 的特殊使用 一览表

    cnblogs的页面, 一种是管理页面, 是随笔的列表 a full list of essays. 另一种是 首页. 要搜索文档的话, 就使用 "首页"的那种方式. 一个jque ...

  2. 解决关于jquery中$.get(）方法总是报“HierarchyRequestError: Node cannot be inserted at the specified point in the hierarchy”错的方法

    解决关于jquery中$.get()方法总是报“HierarchyRequestError: Node cannot be inserted at the specified point in the ...

  3. jQuery中的join方法

    和JS 中的JOIN 方法一样,将一数组按照JOIN的参数连接起来.比如: var arr = [ "a", "b", "c", " ...

  4. jquery中的index方法

    问题描述:灵活使用jquery中的index方法 方法签名:index([selector|element]) 用法概述:P1.index(P2)  //调用者P1可以为对象或集合 参数为空,返回P1 ...

  5. 用JQuery中的Ajax方法获取web service等后台程序中的方法

    用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...

  6. jQuery中的ready方法及实现按需加载css,js

    模拟jQuery中的ready方法及实现按需加载css,js 一.ready函数的实现 经常用jQuery类库或其他类库中的ready方法,有时候想想它们到底是怎么实现的,但是看了一下jQuery中的 ...

  7. $.ajax()方法详解 jquery中的ajax方法

    jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...

  8. jQuery中的$.ajax()方法

    jQuery中的$.ajax()方法 $.ajax({ type:"POST", url:"../page/user.action?userId=" + use ...

  9. jquery中的ajax方法参数

    引用来自:http://www.cnblogs.com/tylerdonet/p/3520862.html jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String ...

  10. HTML5中的data-*属性和jQuery中的.data()方法使用

    原文地址链接:http://blog.csdn.net/fly_zxy/article/details/50687691: HTML5中的data-*属性 我们往往会根据需要在HTML标记上添加自定义 ...

随机推荐

  1. Find the peace with yourself

    The purpose of being mature is to find the real calm and peace with yourself. Or you can say the tur ...

  2. dropdownlist 绑定方法

    this.ddlUnit.SelectedValue = id; //注意大小写,如果选中失败会显示默认值. ListItem item=ddlUnit.Items.FindByValue(id); ...

  3. POI实现数据导入功能

    一.导入过程(基本就是导出的逆向过程) 1.存在一个包含数据的Excel文件 2.将文件作为参数传到服务器 3.服务器解析文件,并将数据封装成实体对象 4.将对象持久化更新到数据库 5.刷新页面导入成 ...

  4. python访问hive

    #!/usr/bin/env python # -*- coding: utf-8 -*- # hive util with hive server2 """ @auth ...

  5. StanFord ML 笔记 第四部分

    第四部分: 1.生成学习法 generate learning algorithm 2.高斯判别分析 Gaussian Discriminant Analysis 3.朴素贝叶斯 Navie Baye ...

  6. raw格式和qcow2格式

    Raw: "raw" 镜像格式是最最简单的,并且是被 KVM 和 Xen 原生支持的格式,你 可以想象裸格式镜像和块设备文件是二进制位相当的,就好像从块设备拷 贝过来的,比方说,使 ...

  7. Linux配置和管理msyql命令

    配置和管理msyql: 1. 修改mysql最大连接数:cp support-files/my-mediuf,vim my.cnf,增加或修改max_connections=1024 关于my.cnf ...

  8. Maven下载私服上的jar包（全局）

    <mirror> <id>maven-public</id> <mirrorOf>maven-public</mirrorOf> <n ...

  9. GPUImage中对比度调整的实现——GPUImageContrastFilter

    对比度指的是一幅图像中明暗区域最亮的白和最暗的黑之间不同亮度层级的测量,差异范围越大代表对比越大,图像越鲜亮,差异范围越小代表对比越小,图像越灰. GPUImage中实现了对比度调整的Filter,其 ...

  10. Getting started with C# and GDAL

    Getting started with C# and GDAL http://vipassanaandenvironmentalinformatics.blogspot.jp/2013/03/get ...