jquery封装的几个效果

最新推荐文章于 2019-03-21 14:48:20 发布
最新推荐文章于 2019-03-21 14:48:20 发布
阅读量1.8k 收藏 1
点赞数
分类专栏： PHP
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/shaobaojie/article/details/17440547
版权 
jQuery.extend({
    //去除左边的空格
    ltrim: function(_str){
        return _str.replace(/(^\s*)/g, "");
    },
    //去除右边的空格
    rtrim: function(_str){
        return _str.replace(/(\s*$)/g, "");
    },
    //因为jquery本身已经有了trim方法,故这里不再重新定义
    //计算字符串长度，一个双字节字符长度计2，ASCII字符计1
    lengthw: function(_str){
        return _str.replace(/[^\x00-\xff]/g, "rr").length;
    },
    //转换为大写
    toUpper: function(_str){
        return _str.toUpperCase();
    },
    //转换为小写
    toLower: function(_str){
        return _str.toLowerCase();
    },
    //15位身份证转换为18位,如果参数字符串中有非数字字符,则返回"#"表示参数不正确
    idCardUpdate: function(_str){
        var idCard18;
        var regIDCard15 = /^(\d){15}$/;
        if (regIDCard15.test(_str)) {
            var nTemp = 0;
            var ArrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
            var ArrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
            _str = _str.substr(0, 6) + '1' + '9' + _str.substr(6, _str.length - 6);
            for (var i = 0; i < _str.length; i++) {
                nTemp += parseInt(_str.substr(i, 1)) * ArrInt[i];
            }
            _str += ArrCh[nTemp % 11];
            idCard18 = _str;
        }
        else {
            idCard18 = "#";
        }
        return idCard18;
    },
    //是否为空字符串
    isEmpty: function(_str){
        var tmp_str = jQuery.trim(_str);
        return tmp_str.length > 0;
    },
    isChinese: function(_str){
        return /^[\u4E00-\u9FA5]{0,25}$/.test(_str);
    },
    isEnglish: function(_str){
    	return /^[A-Za-z]{0,25}$/.test(_str);
    },
    isNumber: function(_str){
    	return /^[\d|\.|,]+$/.test(_str);
    },
    isDate:function(_str){
    	return /^\d{2}\/\d{2}\/\d{4}$/.test(_str);
    },
    isTime: function(_str){
    	return /^\d{2}\/\d{2}\/\d{4}\s\d{2}:\d{2}:\d{2}$/.test(_str);
    },
    //是否为合法电子邮件地址
    isEmail: function(_str){
        return /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/.test(_str);
    },
    //是否合法url地址
    isURL: function(_str){
        var regTextUrl = /^(file|http|https|ftp|mms|telnet|news|wais|mailto):\/\/(.+)$/;
        return regTextUrl.test(_str);
    },
    //是否为合法ip地址
    isIpAddress: function(_str){
        if (_str.length == 0) 
            return (false);
        reVal = /^(\d{1}|\d{2}|[0-1]\d{2}|2[0-4]\d|25[0-5])\.(\d{1}|\d{2}|[0-1]\d{2}|2[0-4]\d|25[0-5])\.(\d{1}|\d{2}|[0-1]\d{2}|2[0-4]\d|25[0-5])\.(\d{1}|\d{2}|[0-1]\d{2}|2[0-4]\d|25[0-5])$/;
        return (reVal.test(_str));
    },
    //是否邮政编码(中国)
    isPostalCode: function(_str){
        var regTextPost = /^(\d){6}$/;
        return regTextPost.test(_str);
    },
    //是否是QQ号码
    isQQ:function(_str){
    	var regTextQQ=/^\d{5,10}$/; 
    	return regTextQQ.test(_str);
    },
    //是否是有效中国身份证
    isIDCard: function(_str){
        var iSum = 0;
        var info = "";
        var sId;
        var aCity = {
            11: "北京",
            12: "天津",
            13: "河北",
            14: "山西",
            15: "内蒙古",
            21: "辽宁",
            22: "吉林",
            23: "黑龙江",
            31: "上海",
            32: "江苏",
            33: "浙江",
            34: "安徽",
            35: "福建",
            36: "江西",
            37: "山东",
            41: "河南",
            42: "湖北",
            43: "湖南",
            44: "广东",
            45: "广西",
            46: "海南",
            50: "重庆",
            51: "四川",
            52: "贵州",
            53: "云南",
            54: "西藏",
            61: "陕西",
            62: "甘肃",
            63: "青海",
            64: "宁夏",
            65: "新疆",
            71: "台湾",
            81: "香港",
            82: "澳门",
            91: "国外"
        };
        //如果输入的为15位数字,则先转换为18位身份证号
        if (_str.length == 15) 
            sId = jQuery.idCardUpdate(_str);
        else 
            sId = _str;
        
        if (!/^\d{17}(\d|x)$/i.test(sId)) {
            return false;
        }
        sId = sId.replace(/x$/i, "a");
        //非法地区
        if (aCity[parseInt(sId.substr(0, 2))] == null) {
            return false;
        }
        var sBirthday = sId.substr(6, 4) + "-" + Number(sId.substr(10, 2)) + "-" + Number(sId.substr(12, 2));
        var d = new Date(sBirthday.replace(/-/g, "/"))
        //非法生日
        if (sBirthday != (d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate())) {
            return false;
        }
        for (var i = 17; i >= 0; i--) {
            iSum += (Math.pow(2, i) % 11) * parseInt(sId.charAt(17 - i), 11);
        }
        if (iSum % 11 != 1) {
            return false;
        }
        return true;
    },
    //是否有效的电话号码(中国)
    isPhoneCall: function(_str){
        return /(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^[0-9]{3,4}[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/.test(_str);
    },
    //是否有效的手机号码(最新的手机号码段可以是15开头的
    isMobile: function(_str){
        return /^0{0,1}1(3|5)[0-9]{9}$/.test(_str);
    },
    //是否有效用户名,长度在6-50之间的，只包含字母，数字和下划线
    isValidUserName: function(_str){
        return /^\w{6,50}$/.test(_str);
    },
    //是否有效密码,长度在6-20之间
    isValidPass: function(_str){
        return /^\w{6,20}$/.test(_str);
    }
});
/**
 * 表单验证插件
 */
$.fn.checkform=function(opt){
	var cfg={
		text:{
			'isNull':'',
			'isEmpty':'',
			'isChinese':'',
			'isURL':'',
			'isEmail':'',
			'isIpAddress':'',
			'isPostalCode':'',
			'isIDCard':'',
			'isQQ':'',
			'isPhoneCall':'',
			'isMobile':'',
			'isValidUserName':'',
			'isValidPass':'',
			'isEnglish':'',
			'isDate':'',
			'isTime':'',
			'isNumber':''
		},
		radioorcheckbox:{
			'checkonly':''
		},
		advance:{
			'compare':'',
			'regexp':'',
			'function':''
		},
		errorClass:'error',
		msgClass:'noticeMsg',
		noticeClass:'noticeInput'
	};
	$.extend(cfg,opt);
	var form=$(this);
	var checkFlag=true;
	function checking(){
		form.find('input[type=text],textarea,select').each(function(){
			var _self=$(this);
			//做基础校验
			for(var i in cfg.text){
				var check=_self.attr(i);
				if(typeof(check)!='undefined'){
					try{
						if(check=='true'){
							checkFlag=$[i](_self.val());
						}
						else{
							checkFlag=eval('('+check+'("'+_self.val()+'"))');
						}
						if(!checkFlag){
							_self.addClass(cfg.errorClass);
							_self.unbind('click',function(){
								form.find('.'+cfg.msgClass).remove();
								$(this).removeClass(cfg.errorClass);
							}).bind('click',function(){
								form.find('.'+cfg.msgClass).remove();
								$(this).removeClass(cfg.errorClass);
							});
							//显示提示语言在输入信息的旁边
							form.find('.'+cfg.msgClass).remove();
							$('<span class="'+cfg.msgClass+'">'+_self.attr('msg')+'</span>').insertAfter(_self);
							return false;
						}
					}catch(error){}
				}
				else{
					continue;
				}
			}
			//高级验证
			for(var i in cfg.advance){
				var check=_self.attr(i);
				if(check){
					switch(i){
						//> < >= <= 四种格式
						//样例 compare=">=:test"
						case 'compare':
						var arr_check=check.split(':');
						var targ=form.find('input[name='+$.trim(arr_check[1])+']').val();
						checkFlag=eval('('+_self.val()+arr_check[0]+targ+')');
						break;
						//自定义正则
						case 'regexp':
						var re=new RegExp(check);
						checkFlag=re.test(_self.val());
						break;
						//自定义函数，要判断是定义匿名函数，还是执行函数
						case 'function':
						checkFlag=eval('('+check+'("'+_self.val()+'"))');
						break;
					}
					if(!checkFlag){
						_self.addClass(cfg.errorClass);
						_self.unbind('click',function(){
							form.find('.'+cfg.msgClass).remove();
							$(this).removeClass(cfg.errorClass);
						}).bind('click',function(){
							form.find('.'+cfg.msgClass).remove();
							$(this).removeClass(cfg.errorClass);
						});
						//显示提示语言在输入信息的旁边
						form.find('.'+cfg.msgClass).remove();
						$('<span class="'+cfg.msgClass+'">'+_self.attr('msg')+'</span>').insertAfter(_self);
						_self.focus();
						return false;
					}
				}
				else{
					continue;
				}
			}
		});
		form.find('input[type=radio],input[type=checkbox]').each(function(){
			var _self=$(this);
			//做基础校验
			for(var i in cfg.radioorcheckbox){
				var check=_self.attr(i);
				if(typeof(check)!='undefined'){
					try{
						if(check=='true'){
							//获得改组radio或者是checkbox
							var name=_self.attr('name');
							if(!form.find('input[name='+name+']:checked')){
								_self.addClass(cfg.errorClass);
								_self.unbind('click',function(){
									form.find('.'+cfg.msgClass).remove();
									$(this).removeClass(cfg.errorClass);
								}).bind('click',function(){
									form.find('.'+cfg.msgClass).remove();
									$(this).removeClass(cfg.errorClass);
								});
								//显示提示语言在输入信息的旁边
								form.find('.'+cfg.msgClass).remove();
								$('<span class="'+cfg.msgClass+'">'+_self.attr('msg')+'</span>').insertAfter(_self);
								_self.focus();
								return false;
							}
						}
					}catch(error){
					}
					//return true;
				}
				else{
					continue;
				}
			}
		});
		return checkFlag;
	}
	function initInput(){
		form.find('input[type=text],input[type=checkbox],input[type=radio],textarea,select').each(function(){
			var _self=$(this);
			_self.change(function(){
				checking();
			});
			var notice=_self.attr('notice');
			if(typeof(notice)!='undefined'){
				//显示提示语言在输入信息的旁边
				_self.focus(function(){
					form.find('.'+cfg.noticeClass).remove();
					$('<span class="'+cfg.noticeClass+'">'+notice+'</span>').insertAfter(_self);
				}).blur(function(){
					form.find('.'+cfg.noticeClass).remove();
				});
			}
		});
	}
	initInput();
	form.submit(function(){
		return checking();
	});
}

shaobaojie
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Jquery封装tab自动切换效果的具体实现
10-27
总结一下，创建一个jQuery封装的tab自动切换效果主要包括以下几个步骤： 1. 设计HTML结构，包括选项卡和对应的内容区域。 2. 编写jQuery代码，定义一个函数用于处理切换逻辑。 3. 使用`setInterval`实现定时自动切换...
jQuery广告banner轮播效果
09-15
在广告Banner轮播效果中，我们需要关注以下几个核心知识点： 1. **选择器与DOM操作**：jQuery提供了丰富的选择器来定位 Banner 中的各个元素，如图片、导航按钮等。通过这些选择器，我们可以轻松获取或修改元素的...
jQuery插件封装（单个插件含多个分支函数）
ASP.NET
11-29 602
(function($) { var methods = { init: function(options) { var $settings = $.extend(true, { 'id': '' }, options); $(this).append("函数 init，参数id:" + $settings.id); }, show: function
一个非常不错的JQUERY的封装的开源组件包。
蓝叶菱的专栏
01-25 856
国产的，地址为：http://ui.operamasks.org/website/demos.html#omGrid#8 可是化jquery的在线网站：http://visualjquery.com/ 通用查询功能第三版EasyQueryVer3使用说明... 11人评 230 48 2011-01-26 NewEasy
GPS设计思路
L_zhoutao的博客
05-20 4209
GPS模块设计思路与学习总结目录 1.组成结构 2.实现思路 2.1. GPS助手 2.2. UBX协议 2.3. RTCM微型无人机连接 2.4. 项目管理的定义 2.5. GPS管理器 2.6. GPS位置信息 2.7. GPS提供商 2.8. 卫星信息 2.9. 飞行器GPS位置 3.GPS相关资料 4.总结 1.组成结构 Drivers/src\ （驱动程序资源包） gps_helper
$符号的封装
weixin_30263073的博客
05-04 94
-<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> div { width: 100px; ...
jq封装好的弹窗，很好用
社会人
03-21 717
就当记事本 记下来 ，以后用直接打开 可以直接下载demo 链接：https://pan.baidu.com/s/1hLeLtzaXPRy9Vbt5IIOGMw 提取码：tjug 复制这段内容后打开百度网盘手机App，操作更方便哦 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org...
jquery封装好的验证码
02-24
封装好的jQuery验证码通常包含以下几个核心组件： 1. **HTML结构**：HTML部分需要一个容器元素来展示验证码图片，通常是一个`<img>`标签，还可能包括一个重试按钮或链接。 2. **JavaScript代码**：这部分是关键，...
常用的几个jquery版本文件
06-25
综上所述，这个压缩包提供的jQuery版本文件涵盖了多个常用版本，能满足不同项目的需求。在选择版本时，需要根据目标用户的浏览器类型和项目的技术需求来决定。使用jQuery，不仅可以提升开发效率，还能确保代码的...
jQuery封装的获取Url中的Get参数示例
10-26
一个标准的URL（统一资源定位符）通常由几个部分组成，包括协议（如http或https）、主机名、路径以及查询字符串。查询字符串就是URL中"?"后面的部分，它包含了以"&"分隔的一系列键值对，用于传递额外的数据。例如，`...
jQuery封装（三）：用正则获取浏览的参数
Fiona_lms的博客
06-08 319
正则为： var reg = new RegExp("(^|\\?|&amp;)" + options + "=([^&amp;]*)(\\s|&amp;|$)", "i"); 接下来，我们封装一下 (function($){ //获取浏览器的参数 jQuery.getUrlData = function(options) { var url ...
封装类似jQuery的选择器
ma125120的博客
11-02 1675
封装类似jQuery的选择器在也可以很轻
Jquery实现无限级树状结构并动态添加增删改等编辑功能
南国樱花祭
04-11 6622
打开演示地址 http://www.56gee.com/Detail/2012/04/11/8AEB74E423/ Jquery实现无限极树状结构并动态添加增删改等编辑功能——56gee div, ul, li { margin: 0px; padding: 0px; list-style-type: none; } body {
JQuery 正则表达式以及验证方法
Jonly_W的博客
01-04 1122
常见的正则表达式 一、校验数字的表达式  1 数字：^[0-9]*$  2 n位的数字：^\d{n}$  3 至少n位的数字：^\d{n,}$  4 m-n位的数字：^\d{m,n}$  5 零和非零开头的数字：^(0|[1-9][0-9]*)$  6 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$  7 带1-2位小数的正数或负数：^
jquery封装（-）
juddy123的博客
05-16 784
页面弹窗的写法：            .pop-bg{width: 100%;  height:100%;  overflow-y:scroll;  position:fixed;  top:0;  left:0;  background:rgba(66,66,66,.5);} .pop{width: 660px;position:relative;background:#fff
封装两个简单的jquery组件
热门推荐
Sara_xie的专栏
08-08 1万+
Jquery给我们提供了很大的方便，我们把他堪称是一个公共库，以致在这个公共库上延伸出了很多jquery插件。 主要说两个项目用途： （1）遮罩层，跟一般的遮罩层不一样，我需要实现的是对某一个元素进行局部遮罩； （2）冒泡提示，网上有很多，我需要的只是一种在页面指定位置弹出来的一个静止定位的div而已。 /*产生随机数*/  ; (function($){       $.Ra
jQuery封装的页面数据加载动画效果
Dendy之Java小屋
07-19 157
1、CSS样式： @CHARSET "UTF-8"; * html .showbox,* html .overlay { position: absolute; top: expression(eval(document.documentElement.scrollTop) ); } #AjaxLoading { border: 1px solid #8CBEDA; color: ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值