jQuery插件

一、自定义插件
我们需知道:什么是类方法什么是对象方法呢?

类方法就是可以直接用jQuery或者$去点击的函数方法称之为类方法;而对象方法就是指需要一个对象去点击的方法eg:按钮.click()就是一个典型的对象方法它需要一个按钮对象去点击;

1.1 $.extend(类方法)
        1.1.1自定义类方法作用1:对象继承

                // 1.1 $.extend()实现对象继承
				// 案例1:两个对象的继承
				var s1={};
				var s2 ={"name":"小花","sex":"女"};
				
				// 继承前:
				console.info(s1.name,s2.name);
				console.info(s1.sex,s2.sex);
				// 继承后
				$.extend(s1,s2);
				console.info(s1.name,s2.name);
				console.info(s1.sex,s2.sex);

1.2 $.fn.extend(对象方法)

对象方法的定义和类方法相似作用的话也就是可以通过对象去点击这个自己定义的方法

                //1.3 $.fn.extend()扩展jQuery对象方法
				//案例:实现全选效果
				// $.fn.extend({
				// 	xz:function(){//全部选中
				// 		$(this).each(function(i,ck){
				// 			ck.checked=true;
				// 		})
				// 	},
				// 	bxz:function(){//全部不选中
				// 		$(this).each(function(i,ck){
				// 			ck.checked=false;
				// 		})
				// 	}
				// })
				//调用方法
				// $("#qx").click(function(){
				// 	$(".aa").xz();//所有的复选框调用选中的方法
				// })
				// $("#qxqx").click(function(){
				// 	$(".aa").bxz();//所有的复选框调用选中的方法
				// })
				
				//复选框全选
				// $("#qd").on("click",function(){
				// // 	console.info($("#qd").prop("checked"));
				// // 	if($(this).prop("checked")){
				// 	if($(this).is(":checked")){
				// 		$(".aa").xz();
				// 	}
				// 	else{
				// 			$(".aa").bxz();
				// 	}
				// })
				
				// //完善全选
				// $(".aa").click(function(){
				// 	var f=true;
				// 	//遍历aa
				// 	$(".aa").each(function(i,ck){
				// 		if(ck.checked==false){
				// 			f=false;
				// 		}
				// 	})
				// 	$("#qd").prop("checked",f);
				// })

二、第三方插件
第三方插件的意思就是别人写好的我们从网站上下载下来(要看懂别人的东西)

推荐的插件库有:www.jQuery.com官方网址(在这里我们是用表单验证的插件库:网址:www.jQueryValidation.org)
下载好后就将你要使用的类库引入页面(和引入jQuery类库一样)
可以开始使用了

		//新建表
        <form id="bd">
			用户名:<input type="text" name="yhm"/></br>
			密码:<input type="text" name="mm" id="mm"/></br>
			确认密码:<input type="text" name="qrmm"/></br>
			邮箱:<input type="text" name="yx"/></br>
			年龄:<input type="text" name="nl"/></br>
			网址:<input type="text" name="wz"/></br>
			<input type="submit"value="提交" />
		</form>
                    $("#bd").validate({
					rules:{
						//字段部分
						yhm:{
							required:true,
							rangelength:[6,10]
						},
						mm:"required",
						qrmm:{
							required:true,
							equalTo:"#mm"
						},
						yx:"required",
					},
					messages:{
						yhm:{
							required:"用户名不能为空",
							rangelength:"长度太长"
						}
					}
				})

rules:的意思是规则也就是别人帮我们定义好的我们直接使用就OK所以在这里复分享给大家怎么是用这个表单验证插件的规则:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值