使用jQuery(中级),第1部分使用插件创建和扩展jQuery函数[归纳].pdf资源-CSDN文库

版权申诉

152 浏览量 2021-10-14 01:34:27 上传评论收藏 762KB PDF 举报

资源推荐

资源详情

资源评论

使用 jQuery （中级），第 1 部分: 使用

插件创建和扩展 jQuery 函数

2009 年 4 月 20 日

jQuery 的流行在很大程度上应该归功于其将插件架构包括进来的决定。这个决

定让任何一位第三方开发人员都能超越最初的库函数创建并扩展 jQuery 函

数。结果所产生的这数百个插件几乎能够提供一个 Web 应用程序内所需的任何

一种函数。本文介绍了这个插件架构并解释了 jQuery 是如何让 Web 应用程序

表现得与桌面应用程序一模一样。

简介

自我发表了有关 jQuery JavaScript 库的第一个系列文章（参见参考资料）

的这六个月来，在 jQuery 领域发生了很多事情。对我们这些 jQuery 的信徒

而言，最令人激动的莫过于 Microsoft? 已经选择在其 Visual Studio 套件中

使用 jQuery ，并已经决定将 jQuery 作为目前该套件所包含的惟一的

JavaScript 库。这显示了对 jQuery 的极大支持，帮助巩固了 jQuery 作为适

用于 Web 应用程序的领先 JavaScript 库的地位。 jQuery 受欢迎程度不断攀

升的另一个有力说明是更新后的 Google Trends 图。我在之前的一篇文章中介

绍过该图表，它展示了 jQuery 已经开始渐渐地从备用的这些 JavaScript 库

中脱离出来。而六个月后，这种脱离更为明显，这一点从图 1 和图 2（忽略了

12 份类似股票市场的下跌）所示的这两个更新后的 Google 趋势图中可以看

出。

图 1. 2008 年 6 月常用 JavaScript 库的 Google 趋势图

功能。插件，从名字的字面意义不难看出，就是为了扩展 jQuery 的核心下载

所固有的功能而 “插入” 到 jQuery 的小部件或代码模块。插件社区已经开

发出了上百个插件，这没有丝毫的夸大。无论您的 Web 站点遇到了什么问题，

无论您（或您的客户）需要何种小部件，您都有可能在 jQuery 插件库中找到

解决的办法。而且，插件库内所有的插件都是可免费下载并能在您自已的 Web

站点上使用的。

插件并不只限于用户界面小部件，此外还包括对 jQuery 语法的扩展、额外的

Ajax 函数以及人们改进其开发过程所需要的其他一些创新。更酷的是人们已经

将几个内置的 JavaScript 特性（例如，线程特性 setTimeout() 及

setInterval() ）转换成了 jQuery 语法。这就为开发人员提供了一个纯 jQuery

的开发环境，使处理与维护都更为轻松。

插件

jQuery 插件结构有很多优点。首先，它让您能够只使用 jQuery 核心以外的那

些想要使用的小部件及函数。这在 Web 应用程序中非常重要，因为每附加一个

插件都意味着下载和流量的增加。通过允许您只使用那些希望使用的插件，您

就可以更好地管理 Web 流量。其次，它使那些热情高涨的第三方开发人员可以

创建自已感兴趣的小部件并通过创建他们自已的插件来改进 jQuery 函数，而

不必尝试通过 jQuery 核心代码来实现其想法。这使得 jQuery 的使用者能用

集体的创造力和创造热情来扩展这个库，这样一来，新想法和新小部件的增长

潜力几乎是无限的。这一点与封闭式的结构完全相反，后者需要 jQuery 团队

审查和批准每个插件，这无疑会导致创建瓶颈。第三，这个由 jQuery 团队创

建的插件架构，无论是对创建插件还是对使用插件的开发人员而言，用起来都

很方便，这也是插件能够飞速发展的重要动力。然而，除了这些优点之外，也

有一个不好的方面：这些插件没有正式的测试结构。因此，虽然可以放心 jQuery

核心已经被仔细测试过，但是如若选择使用了一个插件，也只能依靠第三方对

其进行测试了。对于一个十分关键的 Web 应用程序而言，这个缺点应被予以重

视。

要使用一个插件，需要将其放在您的页面上，与对任何 JavaScript 文件所做

的（包括 jQuery 文件本身）无异。因此，如果需要在页面上使用一个插件，

可以将其添加在 jQuery 之后，如清单 1 所示。

清单 1. 如何包含一个插件

type="text/javascript"></script>

本文不会对如何编写插件以及插件如何工作的细节做过多介绍。这些内容会在

将来的一篇文章中介绍，在那篇文章中，您还会编写自已的新插件并将其放到

实际的 jQuery 插件存储库中。本文将着重探讨几个我比较喜欢的插件。这样

做的目的不仅是为了向您展示我几乎每天都要使用的这些插件，还为了能够让

您对 jQuery 插件存储库中可用的东西有一个大致的概念。我希望，借此能激

发起您对插件的兴趣并自已去尝试使用它们。

好，下面就开始介绍我所偏爱的插件。

RightClick 、ExtendedClick 与 Wheel

Web 应用程序的最主要目标之一就是让用户感觉他们像是在一个桌面应用程序

上工作。换句话说就是让 Web 应用程序在视觉和感觉上都做到尽可能地与桌面

应用程序一样。因此，如果一个用户想要一个工具栏显示在其桌面应用程序上

的某个位置，那么 Web 应用程序也应尽量把这个工具栏放在同样的位置。这样

就可以方便用户从桌面应用程序转移到 Web 应用程序，Web 应用程序的成功机

率也会更大。

然而， Web 应用程序中有一个与桌面应用程序不一样的地方，那就是对鼠标事

件的响应。也许您会对此心怀疑问，因为您的 Web 应用程序在您单击鼠标时工

作得很好。当然，在大多数情况下，很多 Web 应用程序在处理鼠标左键单击事

件时都会运行良好。实际上，多数人都习惯了只用鼠标的左键浏览 Web 站点，

这时的 Web 应用程序更像是一个 Apple 应用程序，只用一个键。但所有

Windows? 应用程序都会使用两个鼠标键（有时甚至是 3 个键）。鼠标的左键

用于激活命令，右键用于给出选项。我们已经习惯了这种用法，那么为什么还

有这么多的 Web 应用程序忽略了鼠标右键呢。进一步说，Web 应用程序也忽略

了 CTRL+单击、 Shift+ 单击与鼠标滚轮的操作。那么在忽略了这么多鼠标操作

的情况下，一个 Web 应用程序如何能真正地仿效桌面应用程序呢？一个真正的

Web 应用程序应该充分利用鼠标的功用。

要想弄清忽略鼠标右键单击的 Web 应用程序和没有忽略这些操作的 Web 应用

程序之间的差别，以及额外的鼠标键如何能增强 Web 站点的功能，我们不妨比

较一下 GMail 与 Yahoo Mail 。这里先对 GMail 的粉丝们说声对不起，但在我

看来， Yahoo Mail 在这方面的确比 GMail 做得好。在 GMail 中，对鼠标右键

单击的处理与普通 Web 页面没什么区别。因此，当右键单击 GMail 中的一个

消息时，它展示给您的只是诸如 “Back”、“Inspect Element” 或 “Select

All ” 之类的选项。这些动作与处理消息有什么关系呢？当然，这并不是说鼠

标右键在 GMail 页面中没有任何作用。但我们与 Yahoo Mail 做一下比较，看

看它是如何处理鼠标右键单击的。我们右键单击 Yahoo Mail 页面中的一个消

息时，呈现给我的是包括 “打开”、“打印”、“回复” 和 “删除” 在内

的选项。这些动作都是邮件应用程序中常用的。这些选项就让一个典型的 Web

应用程序非常类似于您在桌面上经常用到的邮件应用程序（试着右键单击

Outlook 中的一个消息，看看哪个 Web 应用程序所提供的选项更接近这些选

项）。图 3 和图 4 显示了右键单击选项的区别。

剩余19页未读，继续阅读

评论收藏

内容反馈

版权申诉

cyh76339129

粉丝: 1
资源: 14万+

使用jQuery(中级),第1部分使用插件创建和扩展jQuery函数[归纳].pdf

jquery插件库(jquery.treeview插件库)

002244_使用_jQuery（中级）_第_1_部分_使用插件创建和扩展_jQuery_函数.doc

jsontree (jquery.treeview.js) jQuery插件版 treeview1.0

使用_jQuery（中级）_第_1_部分_使用插件创建和扩展_jQuery_函数.doc

jQuery打印插件jqprint，内包含使用示例

jquery.media.js 插件实现在线预览PDF文件

jquery.qrcode.min.js---二维码的jquery插件

jquery表单验证插件jquery.form.js.pdf

使用jQuery(中级)

jquery.json-2.3.min.js和jquery.json-2.3.js

jquery.paginate.js分页插件

JQuery信息提示框插件 jquery.toast.js 的使用

jquery.layout 布局插件精简版

jquery.form.js和使用说明

jquery多风格多功能滚动特效代码插件jquery.liMarquee.js下载.zip

Pro.jQuery.精通JQuery.pdf

Jquery插件-分享插件

jquery.easing插件

jquery.event.drag jquery拖动插件

解决win7win8win10装4.8-3.5的.Net framework3.5安装失败问题 附带安装文档

谷歌浏览器axure扩展程序

时序图画图工具-TimeGen3.2安装包

自动控制原理第七版笔记

大唐杯习题合集-历年真题模拟题

百度、高德、腾讯、天地图、谷歌、必应、MapBox等地图金字塔切图工具 MapCutter 3.11.2

zotero-pdf-translate-1.0.24（2023年7月10日）

姓名变为拼音.bas

CiteSpace5.6.R2，目前最稳定的版本，改时间就可以用

typora1.8.10相关资源补丁

最新资源

解决win7win8win10装4.8-3.5的.Net framework3.5安装失败问题附带安装文档