jQuery插件小结
•编写jQuery插件,是从添加一个新的函数属性到jQuery.fn对象开始的,其中新的函数属性名为你要编写插件的名称:
•jQuery.fn.myPlugin = function() {
• // Do your awesome plugin stuff here
•};
<!--[if ppt]-->•<!--[endif]-->
•然而为了确保你的插件不会与其他可能使用$符号的javascript库冲突,将jQuery对象当做参数传递到一个可立即执行的函数表达式中(IIFE),该函数表达式会通过$符号来映射jQuery对象,这样在该函数表达式内,$符号将不会被在其可执行的作用域中的其他库所覆盖。
•(function( $ ) {
• $.fn.myPlugin = function() {
• // Do your awesome plugin stuff here };
})( jQuery );
•编写一个实现了一些功能的插件。
•(function( $ ){
• $.fn.maxHeight = function() {
• var max = 0;
• this.each(function() {
• max = Math.max( max, $(this).height() );
• });
• return max;
• };
• })( jQuery );
•
•var tallest = $('div').maxHeight();
•通过调用 .height() 来获取页面最高div元素的高度。
•包含可选项的复杂可定制化插件,增加能在被调用时可扩展(使用$.extend)的默认设置。避免在调用插件时传递大量参数,在调用时使用一个需要覆盖掉的参数对象。如下
•(function( $ ){
• $.fn.tooltip = function( options ) {
• var settings = $.extend( {
• 'location' : 'top',
• 'background-color' : 'blue'
• }, options);
• return this.each(function() {
• });
• };
• })( jQuery );
• $('div').tooltip({ 'location' : 'left' });
•当使用给定的可选项调用 tooltip 插件方法后,默认的 'location' 属性会被设置成 'left', 而 'background-color' 属性则保持不变。
•一个单独的插件在jQuery.fn对象上的命名空间都不应超过一个。
•应该将所有插件的方法存放在一个对象字面量中,然后通过传递方法的字符串名称来调用。
•(function( $ ){
• var methods = {
• init : function( options ) { // },
• show : function( ) {// },
• hide : function( ) { // },
• update : function( content ) { // }
• };
• $.fn.tooltip = function( method ) {
• if ( methods[method] ) {
• return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
• } else if ( typeof method === 'object' || ! method ) {
•return methods.init.apply( this, arguments );
• } else {
• $.error( 'Method ' + method + ' does not exist on jQuery.tooltip' );
• }
• };
• })( jQuery );
•$('div').tooltip();
•$('div').tooltip({ foo : 'bar' });
•$('div').tooltip('hide');
•$('div').tooltip('update', 'This is the new tooltip content!');
•通过先传递方法的字符串名称,再传递其他一些这个方法可能用到的参数来调用。这种方式的方法封装和架构在jQuery插件社区是一种标准并被无数的插件采用,包括jQuyerUI插件和组件。
相关推荐
EdwardSiCong 2020-11-23
85477104 2020-11-17
hhanbj 2020-11-17
81427005 2020-11-11
seoppt 2020-09-13
honeyth 2020-09-13
WRITEFORSHARE 2020-09-13
84483065 2020-09-11
momode 2020-09-11
85477104 2020-08-15
83510998 2020-08-08
82550495 2020-08-03
tthappyer 2020-08-03
84901334 2020-07-28
tthappyer 2020-07-25
TONIYH 2020-07-22
tztzyzyz 2020-07-20
83510998 2020-07-18
81463166 2020-07-17