jQuery05插件

一.插件
    1.自定义插件
       1.1 $.extend
            【作用1】对象继承： $.extend(对象1，对象2)---->对象1继承对象2

                // $.extend()实现对象继承
				//案例1：两个对象的继承
				var s1={};
				var s2={"name":"欧阳干翔","sex":"女"};
				console.info(s1.name,s1.sex);
				console.info(s2.name,s2.sex);
				//开始继承
				$.extend(s1,s2);//s1继承自s2
				console.info(s1.name,s1.sex);
				console.info(s2.name,s2.sex);

            【作用2】扩展jQuery类方法：$.extend( {方法名：function(){ 方法体  } } )
  注意多个方法之间用逗号隔开
         

               // 案例2：求最大值(最小值)
				$.extend({
					abcd:function(){
						alert(1234);
					},
					getMax:function(a,b){
						return a>b?a:b;
					},
					getMin:function(){
						return a<b?a:b;
					}
				});
				
				//调用类方法
				var max=$.getMax(10,56);
				console.info(max);
				
				console.info($.getMax(12,34));
				
				$.abcd();

       1.2 $.fn.extend
            【作用】扩展jQuery对象方法：$.fn.extend( {方法名：function(){ 方法体  } } )
  注意多个方法之间用逗号隔开
          

              // $.fn.extend()扩展jQuery对象方法
				$.fn.extend({
					xx:function(){
						//遍历
						$(this).each(function(i,ck){//ck指的是每一个复选框
							ck.checked=true;//让其选中
						})
					},
					yy:function(){
						//遍历
						$(this).each(function(i,ck){//ck指的是每一个复选框
							ck.checked=false;//让其不选中
						})
					},
				})
				//案例3：实现全选效果
				//按钮实现全选
				$("#ok").click(function(){
					$(".aaa").xx();
				})
				$("#nook").click(function(){
					$(".aaa").yy();
				})
				
				//复选框实现全选
				$("#qx").on("click",function(){
					//让其他复选框的状态跟全选保持一致
					// console.info($("#qx").prop("checked"));
					// if($(this).prop("checked")==true){//说明全选框选中
					if($(this).is(":checked")){
						$(".aaa").xx();//让其他复选框选中
					}
					else{
						$(".aaa").yy();
					}
				})
				
				//完善全选
				$(".aaa").click(function(){
					var f=true;//假设全选框是选中的
					//遍历
					$(".aaa").each(function(i,ck){//ck指的是每一个复选框
						if(ck.checked==false){//只有有任何一个没选中
							f=false;
						}
					})
					//给全选框重新赋值 改变其状态
					$("#qx").prop("checked",f);
				})

   2.第三方插件
        表单验证
            使用步骤
                【1】.下载jQuery插件验证库
                    jquery.validate.js
                【2】.将类库引入页面
                【3】.两种方式使用验证
                    HTML标签属性方式
                    JS方式【推荐】
       

              $("#myForm").validate({
					rules:{
						//字段的规则部分
						uname:{
							required:true,
							rangelength:[6,10]
						},
						upwd1:"required",
						upwd2:{
							required:true,
							equalTo:"#upwd1"
						},
						uemail:{
							required:true,
							email:true
						},
						uage:{
							required:true,
							range:[1,150]
						},
						uurl:{
							required:true,
							url:true
						}
					},
					messages:{
						//错误信息提示部分
						uname:{
							required:"用户名必填",
							rangelength:"长度要6-10位之间"
						},
					}
				})