`
aaagu1234
  • 浏览: 148859 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jquery 简单插件开发

 
阅读更多
jQuery为开发插件提拱了两个方法,分别是:



jQuery.fn.extend(object);

jQuery.extend(object);



jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。

jQuery.fn.extend(object);给jQuery对象添加方法。





fn 是什么东西呢。查看jQuery代码,就不难发现。


jQuery.fn = jQuery.prototype = {

   init: function( selector, context ) {//.... 

   //......

};



原来 jQuery.fn = jQuery.prototype.对prototype肯定不会陌生啦。



虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便。

jQuery便是一个封装得非常好的类,比如我们用 语句 $("#btn1") 会生成一个 jQuery类的实例。



jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。如:



$.extend({

  add:function(a,b){return a+b;}

});



便为 jQuery 添加一个为 add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了,

$.add(3,4);  //return 7



jQuery.fn.extend(object); 对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。

比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert 当前编辑框里的内容。可以这么做:
Java代码

    $.fn.extend({   
       
       alertWhileClick:function(){   
      
           $(this ).click(function(){   
      
                alert($(this ).val());   
            });   
       
        }   
       
    });   
       
    $("#input1" ).alertWhileClick();  //页面上为:<input id="input1" type="text"/>   





$("#input1") 为一个jQuery实例,当它调用成员方法 alertWhileClick后,便实现了扩展,每次被点击时它会先弹出目前编辑里的内容。



真实的开发过程中,当然不会做这么小白的插件,事实上jQuery提拱了丰富的操作文档,事件,CSS ,Ajax、效果的方法,结合这些方法,便可以开发出更加 Niubility 的插件。
分享到:
评论

相关推荐

    JQuery插件开发

    **jQuery插件开发** 在Web开发领域,jQuery是一款广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。jQuery插件是扩展jQuery功能的一种方式,允许开发者根据需求定制各种功能,如表单验证、...

    jQuery插件开发全解析

    ### jQuery插件开发全解析 #### 一、引言 jQuery作为一款优秀的JavaScript库,在前端开发领域具有举足轻重的地位。它简化了许多常见的JavaScript任务,使得开发者能够更轻松地处理DOM操作、事件处理以及Ajax交互等...

    jquery 插件开发 pdf

    jQuery插件开发是扩展这个库功能的一种常见方式,使得开发者能够根据项目需求创建自定义功能。以下是对jQuery插件开发的详细讲解: 1. **插件基础** - jQuery插件通常是通过扩展jQuery对象的原型链来实现的,这...

    jQuery插件开发详解

    《jQuery插件开发详解》 在Web开发领域,jQuery是一个广泛应用的JavaScript库,它极大地简化了DOM操作、事件处理和动画制作。对于开发者而言,掌握jQuery插件的开发技巧是提升工作效率的重要一环。本篇将深入探讨...

    通用 JQuery 插件 开发

    **通用JQuery插件开发详解** 在Web开发领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。由于其简洁的API和丰富的功能,jQuery成为创建交互式网页的强大工具。...

    jQuery分享插件.zip

    该插件主要基于jQuery框架,提供了一种简单的方法,让网站用户能够一键将内容分享到各种社交媒体平台,如QQ、微信、微博、Google、LinkedIn(in)、Twitter(tweeter)等。在网页开发中,这种分享功能可以提升用户...

    jQuery常用插件大全pdf

    **知识点**: 类似于Facebook的AutoCompleter插件,基于jQuery开发,模仿社交网络的自动补全功能,提升用户体验。 #### 5. jQueryAutocompleteMod **知识点**: 自动完成插件,支持限制下拉菜单显示的结果数量,优化...

    jquery图表插件大全收集

    描述中的重复信息“jquery图表插件大全收集jquery图表插件大全收集jquery图表插件大全收集”可能是强调这个资源的全面性,意味着用户可以在这里找到大量关于jQuery图表插件的信息和实例。 标签“jquery图表插件大全...

    基于jquery.masonry插件开发的瀑布流ajax动态加载数据功能

    jQuery Masonry插件是由David DeSandro开发的一个JavaScript库,它的主要功能是将网页中的元素以瀑布流的形式排列。该插件能够自动调整元素的位置,使其在有限的空间内达到最佳的展示效果。在使用jQuery Masonry时,...

    JQuery简单插件示意,介绍插件的基本写法格式

    在JavaScript的世界里,jQuery是一个广泛使用的库,它简化了DOM操作、事件处理、动画效果以及Ajax交互等任务。本篇文章将深入探讨如何编写一个简单的...通过不断地实践和学习,你将在jQuery插件开发方面变得更加熟练。

    jQuery插件开发详细教程

    jQuery插件开发是一项能够极大提升前端开发效率和代码可复用性的技术。在学习开发jQuery插件之前,需要先了解一些基础概念和最佳实践,以及避免在开发过程中的一些常见陷阱。 首先,我们需要掌握什么是jQuery插件。...

    jquery分页插件-内有演示说明

    **jQuery分页插件**是Web开发中常用的一种工具,用于在大量数据中实现高效的页面导航,提升用户体验。本资源包含一个演示说明,使得理解和应用变得更加直观和简单。以下将详细解析jQuery分页插件的核心知识点及其...

    jQuery的车牌插件

    4. **兼容性**:由于是基于jQuery开发,所以该插件应具有良好的浏览器兼容性,能够在大部分现代浏览器上正常工作,包括桌面和移动端。 5. **易于集成**:作为一款jQuery插件,它应该提供简单的API接口和配置选项,...

    简单的jQuery分页插件下载.zip

    本资源提供的"简单的jQuery分页插件下载.zip"包含了一个名为"jQuery.page.js"的插件文件,该插件设计简单易用,无需复杂的配置,即可在网页上实现基本的分页功能。 **jQuery.page.js的使用方法** 1. **引入jQuery...

    jquery表单验证插件

    jQuery Form插件由Malsup开发,是一款非常实用的jQuery扩展,能够极大地简化表单的Ajax提交过程。它不仅提供了一套完整的API来管理表单数据,还支持复杂的表单验证与文件上传等功能。 ##### 2.1 主要特性 - **Ajax...

    JQ jQuery插件如何开发

    一个简单的jQuery插件通常由一个函数定义,该函数接收一个jQuery对象作为参数,这使得插件可以作用于一个或多个DOM元素。以下是一个基础的jQuery插件模板: ```javascript (function($) { $.fn.myPlugin = ...

    JQuery插件开发 + 插件

    **jQuery插件开发详解** jQuery,作为一款广泛使用的JavaScript库,极大地简化了DOM操作、事件处理、动画制作等任务。其强大的功能和易用性使得开发者可以快速构建交互丰富的Web应用。开发jQuery插件是扩展其功能的...

    jQuery简易的日历插件下载.zip

    总的来说,jQuery简易日历插件是网页开发中一个实用的工具,它简化了日期选择功能的实现,让开发者可以专注于其他更重要的业务逻辑。对于初学者来说,这是一个了解JavaScript事件处理、DOM操作和插件化开发的好起点...

    jquery media插件 在线显示pdf (兼容ie 各个版本 ,火狐,谷歌)

    《jQuery Media插件:在线显示PDF的全平台解决方案》 在网页开发中,尤其是在教育、出版、企业等领域的网站上,经常需要展示PDF文档供用户在线预览。考虑到浏览器兼容性和用户体验,选择合适的插件至关重要。jQuery...

Global site tag (gtag.js) - Google Analytics