自义定插件与第三方表单插件

回顾上一节:

click 点击事件 mouseover 鼠标移入事件 mouseout 鼠标移出事件

focus 获取焦点事件 blur失去焦点事件 keyup 按键事件


自定义插件:

  // $.extend();   $.fn.extend();

$.extend()实现对象继承:

var person = {"name":"东方不败","sex":"女"};
				var stu = {};
				console.log($.type(stu));
				console.log(stu);
				// 通过$.extend();为stu继承person中的所有属性
				$.extend(stu,person);
				console.log(stu);

测试结果:

 涉及到三个参数的继承:

 第一个参数的对象会继承后面所有对象的属性(wjq会有继承所有的属性):

var person = {"name":"东方不败","sex":"女"};
				var stu = {"age":18};
				var wjq = {};
				console.log(person);
				console.log(stu);
				console.log(wjq);
				console.log("------------------");
				$.extend(wjq,stu,person);
				console.log(person);
				console.log(stu);
				console.log(wjq);

测试结果:

自义定插件与第三方表单插件_第1张图片

 $.extend()扩展jQuery类方法:

$.extend({
					// arguments参数 类似一个数组,存储参数的个数
			此处可以通过键值对的形式创建jQuery的类方法  将来可以通过$直接调用
					"myMax2":function(){
						// console.log(arguments.length);
						// 打擂台的思想
						var max = arguments[0];//假设这个arguments数组中的第一个值为最大值
						// console.log(arguments[0]);
						for(var i = 0;i arguments[i]){
								min = arguments[i];
							}
						}
						return min;
					}
				});
 
测试
console.log("12,2,3,56数字中最大值是");
console.log($.myMax2(12,2,3,56));
console.log("22,3,2数字中最小值是");
console.log($.myMin(22,3,2));

测试结果:

 $.fn.extend() 扩展jQuery对象方法:

$.fn.extend({
					// 全选的对象方法
					"demo1":function(){
						// 在对象方法中,$(this)代表将来谁调用了,就代表谁
						// console.log($(this));
						// $(this).each(function(){
						// 	$(this).prop("checked",true);
						// });
						// jQuery的特性中有一个隐式迭代器
						$(this).prop("checked",true);
					},
					"demo2":function(){
						$(this).prop("checked",false);
					}
				});
全选按钮
$("#checkall").click(function(){
					// 通过获取到复选框  然后调用对象方法demo1 设置所有复选框选中
                     所有复选框
					$("input:checkbox").demo1();
				});
				$("#qxcheckall").click(function(){
					// 通过获取到复选框  然后调用对象方法demo1 设置所有复选框选中
					$("input:checkbox").demo2();
				});
				
 
			})

 第三方插件:表单验证插件:

需要下载 jquery\validate 插件:

自义定插件与第三方表单插件_第2张图片

 jQuery的表单验证代码:



	
		
		
		
		
		
		
	
	
 
		
账号:
密码
邮箱
出生日期

你可能感兴趣的:(css,jQuery,JS,css,html,jquery,javascript)