关于jQuery中自定义函数的操作

jQuery.extend(object);$.extend(object); //是对jquery类的扩展
jQuery.fn.extend(object);$.fn.extend(object); //是对jQuery对象的扩展
jQuery.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。

jQuery.fn = jQuery.prototype = {

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

   //......

};

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

第一种方式: 是对JQuery对象的扩展< 调用方式:$(this).ycDialog(opts) >
jQuery.fn.extend({ 'ycDialog':function(opts){ this._flag=false;//用于判断是否触发了确定按钮 var $dialog = $("<div class='yc_dialog'>"+ " <div class='yc_title'>"+ " <h3 class='yc_h3'>"+opts.title+"</h3>"+ " <a href='#' class='yc_close'>X</a>"+ " </div>"+ " <div class='yc_content'>"+ " <div class='yc_message'>"+ " <span class='yc_icon'></span>"+ " <span class='yc_con'>"+opts.content+"</span>"+ " <div class='yc_clear'></div>"+ " </div>"+ " <div class='yc_btn'>"+ " <input type='button' value='确定' class='yc_ok'/>"+ " </div>"+ " </div>"+ " </div>"); $("body").append($dialog).append("<div class='yc_yy'></div>"); if(opts.dialogWidth){ dealDialogWidth(opts.dialogWidth); }else{ dealDialogWidth(300); } if(opts.dialogHeight){ dealDialogHeight(opts.dialogHeight); }else{ dealDialogHeight(160); } if(opts.icon){ $(".yc_message .yc_icon").addClass("yc_"+opts.icon); if(opts.icon=="confirm"){ $(".yc_dialog .yc_close").show(); $(".yc_btn").append("<input type='button' value='取消' class='yc_no'/>"); } }else{ $(".yc_dialog .yc_close").hide(); $(".yc_message .yc_icon").addClass("yc_success"); } if(opts._CONFIRM) $dialog._CONFIRM=opts._CONFIRM; if(opts._URL) $dialog._URL =opts._URL; if(opts._ARRAY) $dialog._ARRAY = opts._ARRAY; yc_center($dialog); yc_initEvent($dialog); } });

第二种方式: 是对JQuery类的扩展< 调用方式:$.ycDialog(opts) >
jQuery.extend({
     
     ycDialog:function(opts){
                
                this._flag=false;//用于判断是否触发了确定按钮             
		var $dialog = $("<div class='yc_dialog'>"+
						"		<div class='yc_title'>"+
						"			<h3 class='yc_h3'>"+opts.title+"</h3>"+
						"			<a href='#' class='yc_close'>X</a>"+
						"		</div>"+
						"		<div class='yc_content'>"+
						"			<div class='yc_message'>"+
						"				<span class='yc_icon'></span>"+
						"				<span class='yc_con'>"+opts.content+"</span>"+
						"				<div class='yc_clear'></div>"+
						"			</div>"+
						"			<div class='yc_btn'>"+
						"				<input type='button' value='确定' class='yc_ok'/>"+
						"			</div>"+
						"		</div>"+
						"	</div>");  
		$("body").append($dialog).append("<div class='yc_yy'></div>");
              
		if(opts.dialogWidth){
		    
		    dealDialogWidth(opts.dialogWidth);	 
		}else{
		     dealDialogWidth(300);
		}
		if(opts.dialogHeight){
			 dealDialogHeight(opts.dialogHeight);
		}else{
		    dealDialogHeight(160);
		}
		if(opts.icon){
		    $(".yc_message .yc_icon").addClass("yc_"+opts.icon);
                    if(opts.icon=="confirm"){
                      $(".yc_dialog .yc_close").show();
                      $(".yc_btn").append("<input type='button' value='取消' class='yc_no'/>");
                    }
		}else{
                   $(".yc_dialog .yc_close").hide();
		   $(".yc_message .yc_icon").addClass("yc_success");
		}
                
                if(opts._CONFIRM)
                    $dialog._CONFIRM=opts._CONFIRM;
                if(opts._URL)
                   $dialog._URL =opts._URL;
                if(opts._ARRAY)
                   $dialog._ARRAY = opts._ARRAY;
		yc_center($dialog);
		yc_initEvent($dialog);
	  }
 });
 

第三种方式:仍然是对于方法的扩展 < 调用方式:$(this).ycDialog(opts) > jQuery.fn.ycDialog=function(opts){ this._flag=false;//用于判断是否触发了确定按钮 var $dialog = $("<div class='yc_dialog'>"+ " <div class='yc_title'>"+ " <h3 class='yc_h3'>"+opts.title+"</h3>"+ " <a href='#' class='yc_close'>X</a>"+ " </div>"+ " <div class='yc_content'>"+ " <div class='yc_message'>"+ " <span class='yc_icon'></span>"+ " <span class='yc_con'>"+opts.content+"</span>"+ " <div class='yc_clear'></div>"+ " </div>"+ " <div class='yc_btn'>"+ " <input type='button' value='确定' class='yc_ok'/>"+ " </div>"+ " </div>"+ " </div>"); $("body").append($dialog).append("<div class='yc_yy'></div>"); if(opts.dialogWidth){ dealDialogWidth(opts.dialogWidth); }else{ dealDialogWidth(300); } if(opts.dialogHeight){ dealDialogHeight(opts.dialogHeight); }else{ dealDialogHeight(160); } if(opts.icon){ $(".yc_message .yc_icon").addClass("yc_"+opts.icon); if(opts.icon=="confirm"){ $(".yc_dialog .yc_close").show(); $(".yc_btn").append("<input type='button' value='取消' class='yc_no'/>"); } }else{ $(".yc_dialog .yc_close").hide(); $(".yc_message .yc_icon").addClass("yc_success"); } if(opts._CONFIRM) $dialog._CONFIRM=opts._CONFIRM; if(opts._URL) $dialog._URL =opts._URL; if(opts._ARRAY) $dialog._ARRAY = opts._ARRAY; yc_center($dialog); yc_initEvent($dialog); };
posted @ 2015-10-15 12:16  yu0312chao  阅读(533)  评论(0编辑  收藏  举报