zoukankan      html  css  js  c++  java
  • jquery ui core的写法和注释

    /*!
     * 基于jQuery UI 1.8.20改造
     * 保留jQuery UI的版权信息
     * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
     * Dual licensed under the MIT or GPL Version 2 licenses.
     * http://jquery.org/license
     */
    ;(function( $, undefined ) {
    
    // prevent duplicate loading
    // this is only a problem because we proxy existing functions
    // and we don't want to double proxy them
    $.tui = $.tui || {};
    if ( $.tui.version ) {
    	return;
    }
    $.extend( $.tui, {
    	version: "0.5.0",//版本控制,在前端eico上线时,发布1.0版本。每个功能修改,测试通过后,发布小数点后一位版本
    	keyCode: {
    		ALT: 18,
    		BACKSPACE: 8,
    		CAPS_LOCK: 20,
    		COMMA: 188,
    		COMMAND: 91,
    		COMMAND_LEFT: 91, // COMMAND
    		COMMAND_RIGHT: 93,
    		CONTROL: 17,
    		DELETE: 46,
    		DOWN: 40,
    		END: 35,
    		ENTER: 13,
    		ESCAPE: 27,
    		HOME: 36,
    		INSERT: 45,
    		LEFT: 37,
    		MENU: 93, // COMMAND_RIGHT
    		NUMPAD_ADD: 107,
    		NUMPAD_DECIMAL: 110,
    		NUMPAD_DIVIDE: 111,
    		NUMPAD_ENTER: 108,
    		NUMPAD_MULTIPLY: 106,
    		NUMPAD_SUBTRACT: 109,
    		PAGE_DOWN: 34,
    		PAGE_UP: 33,
    		PERIOD: 190,
    		RIGHT: 39,
    		SHIFT: 16,
    		SPACE: 32,
    		TAB: 9,
    		UP: 38,
    		WINDOWS: 91 // COMMAND
    	}
    });
    
    // plugins
    $.fn.extend({
    	//propAttr: $.fn.prop || $.fn.attr,
    	_focus: $.fn.focus,//保留原来jquery的focus方法。
    	//从新改写focus方法。扩展了jquery focus的方法。传入延迟多长时间,执行函数
    	tuiFocus: function( delay, fn ) {
    		return typeof delay === "number" ?
    			this.each(function() {
    				var elem = this;
    				setTimeout(function() {
    					$( elem ).focus();
    					if ( fn ) {
    						fn.call( elem );
    					}
    				}, delay );
    			}) :
    			this._focus.apply( this, arguments );
    	},
     //获取设置滚动属性的 父元素
     //curCSS取得当前的css的值,属于jquery内部的函数,没有在api中体现 // DEPRECATED in 1.3, Use jQuery.css() instead jQuery.curCSS = jQuery.css;
     //// 读取样式值css: function( elem, name, extra )  jQuery.css() 
    	tuiScrollParent: function() {
    		var scrollParent;
    	if (($.browser.msie && (/(static|relative)/).test(this.css('position'))) || (/absolute/).test(this.css('position'))) {//ie同时相对定位或者绝对定位
    			scrollParent = this.parents().filter(function() {
    				return (/(relative|absolute|fixed)/).test($.curCSS(this,'position',1)) && (/(auto|scroll)/).test($.curCSS(this,'overflow',1)+$.curCSS(this,'overflow-y',1)+$.curCSS(this,'overflow-x',1));//fucntion里面的函数,当前的css是否有定位和滚动
    			}).eq(0);
    		} else {
    			scrollParent = this.parents().filter(function() {
    				return (/(auto|scroll)/).test($.curCSS(this,'overflow',1)+$.curCSS(this,'overflow-y',1)+$.curCSS(this,'overflow-x',1));
    			}).eq(0);
    		}
    		
    		return (/fixed/).test(this.css('position')) || !scrollParent.length ? $(document) : scrollParent;//如果是fixed,不找父元素,无论他有没有
    	},
      //设置或获取元素的垂直坐标
    	tuiZIndex: function( zIndex ) {
    		if ( zIndex !== undefined ) {
    			return this.css( "zIndex", zIndex );
    		}
    
    		if ( this.length ) {
    			var elem = $( this[ 0 ] ), position, value;
    			while ( elem.length && elem[ 0 ] !== document ) {
    				// Ignore z-index if position is set to a value where z-index is ignored by the browser
    				// This makes behavior of this function consistent across browsers
    				// WebKit always returns auto if the element is positioned
    				position = elem.css( "position" );
    				if ( position === "absolute" || position === "relative" || position === "fixed" ) {
    					// IE returns 0 when zIndex is not specified
    					// other browsers return a string
    					// we ignore the case of nested elements with an explicit value of 0
    					// <div style="z-index: -10;"><div style="z-index: 0;"></div></div>
    					value = parseInt( elem.css( "zIndex" ), 10 );
    					if ( !isNaN( value ) && value !== 0 ) {
    						return value;
    					}
    				}
    				elem = elem.parent();//不断循环找父元素,可以取得父元素的zindex
    			}
    		}
    
    		return 0;
    	},
     //设置元素不支持被选择
    	tuiDisableSelection: function() {
    		return this.bind( ( $.support.selectstart ? "selectstart" : "mousedown" ) +
    			".tui-disableSelection", function( event ) {
    				event.preventDefault();
    			});
    	},
     //设置元素支持被选择
    	tuiEnableSelection: function() {
    		return this.unbind( ".tui-disableSelection" );
    	}
    });//$.fn.extend结束
    //不需要调用,全局的执行从新定义了innerHeight、innerWidth、outerHeight、outerWidth的方法,可以设置上面的值
    $.each( [ "Width", "Height" ], function( i, name ) {
    	var side = name === "Width" ? [ "Left", "Right" ] : [ "Top", "Bottom" ],
    		type = name.toLowerCase(),//设置css的名称
    		orig = {//系统原来的方法
    			innerWidth: $.fn.innerWidth,//包括补白不包括边框
    			innerHeight: $.fn.innerHeight,
    			outerWidth: $.fn.outerWidth,//补白不包括边框
    			outerHeight: $.fn.outerHeight
    		};
         //返回需要设置的值,是当前元素padding,border上left right top  bottom的值
    	function reduce( elem, size, border, margin ) {
    		$.each( side, function() {//side是如果宽度是left right,高度是top bottom,就是调整padding,border上left right top  bottom的值
    			size -= parseFloat( $.curCSS( elem, "padding" + this, true) ) || 0;
    			if ( border ) {
    				size -= parseFloat( $.curCSS( elem, "border" + this + "Width", true) ) || 0;
    			}
    			if ( margin ) {
    				size -= parseFloat( $.curCSS( elem, "margin" + this, true) ) || 0;
    			}
    		});
    		return size;
    	}
         //从新定义,允许设置值。通过更改传入元素css的"Width", "Height"的值来达到目的, 
    	$.fn[ "tuiInner" + name ] = function( size ) {
    		if ( size === undefined ) {
    			return orig[ "inner" + name ].call( this );
    		}
            //inner,仅仅是补白 padding的距离
    		return this.each(function() {
    			$( this ).css( type, reduce( this, size ) + "px" );
    		});
    	};
        //outer,是补白和边框,如果设置margin了,就加上margin的距离
    	$.fn[ "tuiOuter" + name] = function( size, margin ) {
    		if ( typeof size !== "number" ) {
    			return orig[ "outer" + name ].call( this, size );
    		}
    
    		return this.each(function() {
    			$( this).css( type, reduce( this, size, true, margin ) + "px" );
    		});
    	};
    });//each结束
    
    // 内部方法,下面extend会用
    function focusable( element, isTabIndexNotNaN ) {
    	var nodeName = element.nodeName.toLowerCase();
    	if ( "area" === nodeName ) {
    		var map = element.parentNode,
    			mapName = map.name,
    			img;
    		if ( !element.href || !mapName || map.nodeName.toLowerCase() !== "map" ) {
    			return false;
    		}
    		img = $( "img[usemap=#" + mapName + "]" )[0];
    		return !!img && visible( img );
    	}
    	return ( /input|select|textarea|button|object/.test( nodeName )
    		? !element.disabled
    		: "a" == nodeName
    			? element.href || isTabIndexNotNaN
    			: isTabIndexNotNaN)
    		// the element and all of its ancestors must be visible
    		&& visible( element );
    }
    //内部方法
    function visible( element ) {
    	return !$( element ).parents().andSelf().filter(function() {
    		return $.curCSS( this, "visibility" ) === "hidden" ||
    			$.expr.filters.hidden( this );
    	}).length;
    }
    //jQuery.expr[":"] = jQuery.expr.filters; 扩展jQuery.expr.filters 的筛选方法,在jquery-1.4.1.js中有其他方法
    $.extend( $.expr[ ":" ], {
    	data: function( elem, i, match ) {
    		return !!$.data( elem, match[ 3 ] );
    	},
    
    	focusable: function( element ) {
    		return focusable( element, !isNaN( $.attr( element, "tabindex" ) ) );
    	},
    
    	tabbable: function( element ) {
    		var tabIndex = $.attr( element, "tabindex" ),
    			isTabIndexNaN = isNaN( tabIndex );
    		return ( isTabIndexNaN || tabIndex >= 0 ) && focusable( element, !isTabIndexNaN );
    	}
    });
    // 支持信息,扩展support方法
    $(function() {
    	var body = document.body,
    		div = body.appendChild( div = document.createElement( "div" ) );
    
    	// access offsetHeight before setting the style to prevent a layout bug
    	// in IE 9 which causes the elemnt to continue to take up space even
    	// after it is removed from the DOM (#8026)
    	div.offsetHeight;
    
    	$.extend( div.style, {
    		minHeight: "100px",
    		height: "auto",
    		padding: 0,
    		borderWidth: 0
    	});
    
    	$.support.minHeight = div.offsetHeight === 100;
    	$.support.selectstart = "onselectstart" in div;
    
    	// set display to none to avoid a layout bug in IE
    	// http://dev.jquery.com/ticket/4014
    	body.removeChild( div ).style.display = "none";
    });
    //自己补充的方法,与原来的jquer ui没有关系。
    $.extend($.tui,{
    	isIE:function(){
    	   return /MSIE (\d)\./i.test(navigator.userAgent); //IE浏览器
    		},
    	isIE6:function(){
    	   return /MSIE (\d)\./i.test(navigator.userAgent) && parseInt(RegExp.$1) == 6;
    	   },
    	isIE7:function(){
    		return /MSIE (\d)\./i.test(navigator.userAgent) && parseInt(RegExp.$1) == 7;
    	   },
    	isIE8:function(){
    		return /MSIE (\d)\./i.test(navigator.userAgent) && parseInt(RegExp.$1) == 8;
    	   },
    	isIE9:function(){
    	   return /MSIE (\d)\./i.test(navigator.userAgent) && parseInt(RegExp.$1) == 9;
    	   },
    	isFirefox:function(){
    	   return /firefox\/([\d.]+)/i.test(navigator.userAgent);
    	   },
    	isChrome:function(){
    	   return /chrome\/([\d.]+)/i.test(navigator.userAgent);
    	   },
    	isSafari:function(){
    	   return /safari\/([\d.]+)/i.test(navigator.userAgent);
    	   },
    	showMask:function(maskId,zIndex,top,left,appendObject,eventType,eventFunction){//显示遮罩,可以给遮罩上绑定事件
    		var $doc=$(document);
    		var $mask;
    		if($('#'+maskId).length<1){//如果没有遮罩
    			var maskHTML='<div id="'+maskId+'"style="position:absolute;z-index:'+zIndex+';top:'+top+'px;left:'+left+'px;"><div>';
    			$mask= $(maskHTML).appendTo(appendObject);
    		}else {$mask=$('#'+maskId)}
    		$mask.css({$doc.width()+'px',height:$doc.height()+'px'});
    		$mask.show();//显示遮罩层,由于可能是已经存在并且隐藏了。
    		$(window,'#'+maskId).unbind(eventType).bind(eventType,eventFunction);//bind事件结束
    		return $mask;
    		}//showMask方法结束			
    	});
    // 已经弃用的方法,因为被包含到jquery标准了
    $.extend( $.tui, {
    	// $.ui.plugin is deprecated.  Use the proxy pattern instead.
    	plugin: {
    		add: function( module, option, set ) {
    			var proto = $.ui[ module ].prototype;
    			for ( var i in set ) {
    				proto.plugins[ i ] = proto.plugins[ i ] || [];
    				proto.plugins[ i ].push( [ option, set[ i ] ] );
    			}
    		},
    		call: function( instance, name, args ) {
    			var set = instance.plugins[ name ];
    			if ( !set || !instance.element[ 0 ].parentNode ) {
    				return;
    			}
    	
    			for ( var i = 0; i < set.length; i++ ) {
    				if ( instance.options[ set[ i ][ 0 ] ] ) {
    					set[ i ][ 1 ].apply( instance.element, args );
    				}
    			}
    		}
    	},
    	
    	// will be deprecated when we switch to jQuery 1.4 - use jQuery.contains()
    	contains: function( a, b ) {
    		return document.compareDocumentPosition ?
    			a.compareDocumentPosition( b ) & 16 :
    			a !== b && a.contains( b );
    	},
    	
    	// only used by resizable
    	hasScroll: function( el, a ) {
    	
    		//If overflow is hidden, the element might have extra content, but the user wants to hide it
    		if ( $( el ).css( "overflow" ) === "hidden") {
    			return false;
    		}
    	
    		var scroll = ( a && a === "left" ) ? "scrollLeft" : "scrollTop",
    			has = false;
    	
    		if ( el[ scroll ] > 0 ) {
    			return true;
    		}
    	
    		// TODO: determine which cases actually cause this to happen
    		// if the element doesn't have the scroll set, see if it's possible to
    		// set the scroll
    		el[ scroll ] = 1;
    		has = ( el[ scroll ] > 0 );
    		el[ scroll ] = 0;
    		return has;
    	},
    	
    	// these are odd functions, fix the API or move into individual plugins
    	isOverAxis: function( x, reference, size ) {
    		//Determines when x coordinate is over "b" element axis
    		return ( x > reference ) && ( x < ( reference + size ) );
    	},
    	isOver: function( y, x, top, left, height, width ) {
    		//Determines when x, y coordinates is over "b" element
    		return $.ui.isOverAxis( y, top, height ) && $.ui.isOverAxis( x, left, width );
    	}
    });
    
    })( jQuery );
    

      

  • 相关阅读:
    DVWA的安装及报错解决
    隐写工具F5-steganography的使用
    python skimage库的安装
    密码学笔记——zip明文攻击
    密码学笔记-一段base64wp
    kali中网卡、ssh、apache的配置与开启
    密码学笔记——希尔密码
    密码学笔记——playfair密码
    使用electron-packager electron-builder electron-updater 打包vue项目,支持在线更新
    搭建vue脚手架,包含Axios、qs、Element-UI、mock等插件的安装配置
  • 原文地址:https://www.cnblogs.com/danghuijian/p/2695644.html
Copyright © 2011-2022 走看看