文档章节

项目常见函数封装,基于Jquery

深圳大道
 深圳大道
发布于 2016/12/29 15:39
字数 2262
阅读 4
收藏 0
/// <reference path="jquery-1.8.0.min.js" />
/*
* DIV或元素居中
* @return
*/
jQuery.fn.mCenterDiv = function () {
    this.css("position", "absolute");
    this.css("border", "1px solid #ccc");
    this.css("top", ($(window).height() - this.height()) / 2 + $(window).scrollTop() + "px");
    this.css("left", ($(window).width() - this.width()) / 2 + $(window).scrollLeft() + "px");
    this.show(100);
    return this;
};

/*
* 替换字符串中所有符合的字符
* @param ASource 源字符串
* @param AFindText 待替换字符
* @param ARepText 替换后字符
* @return
*/
jQuery.mReplaceAll = function (ASource,AFindText, ARepText) {
    var raRegExp = new RegExp(AFindText, "g");
    return ASource.replace(raRegExp, ARepText);
};

/*
* 判断object是否空,未定义或null
* @param object 
* @return
*/
jQuery.mIsNull = function (obj) {
    if (obj == "" || typeof(obj) == "undefined" || obj == null) {
        return true;
    }
    else {
        return false;
    }
};

/*
* 获取URL参数
* @param name 参数
* @return
*/
jQuery.mGetUrlParam = function (name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]); return null;
};

/*
* 乘法函数,用来得到精确的乘法结果
* @param arg1 参数1
* @param arg2 参数2
* @return
*/
jQuery.mAccMul = function(arg1, arg2) {
    var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
    try { m += s1.split(".")[1].length } catch (e) { }
    try { m += s2.split(".")[1].length } catch (e) { }
    return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
}

/*
* 获取随机数
* @param x 下限
* @param y 上限
* @return
*/
jQuery.mGetRandom = function (x, y) {
   return parseInt(Math.random() * (y - x + 1) + x);

};

/*
* 将数值四舍五入(保留2位小数)后格式化成金额形式
* @param num 数值(Number或者String)
* @return 金额格式的字符串,如'1,234,567.45'
*/
jQuery.mFormatCurrency = function(num) {
    num = num.toString().replace(/\$|\,/g, '');
    if (isNaN(num))
        num = "0";
    sign = (num == (num = Math.abs(num)));
    num = Math.floor(num * 100 + 0.50000000001);
    cents = num % 100;
    num = Math.floor(num / 100).toString();
    if (cents < 10)
        cents = "0" + cents;
    for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
        num = num.substring(0, num.length - (4 * i + 3)) + ',' +
    num.substring(num.length - (4 * i + 3));
    return (((sign) ? '' : '-') + num + '.' + cents);
}

/*
* 正则验证
* @param s 验证字符串
* @param type 验证类型 money,china,mobile等 
* @return
*/
jQuery.mCheck = function (s, type) {
    var objbool = false;
    var objexp = "";
    switch (type) {
        case 'money': //金额格式,格式定义为带小数的正数,小数点后最多三位
            objexp = "^[0-9]+[\.][0-9]{0,3}$";
            break;
        case 'numletter_': //英文字母和数字和下划线组成   
            objexp = "^[0-9a-zA-Z\_]+$";
            break;
        case 'numletter': //英文字母和数字组成
            objexp = "^[0-9a-zA-Z]+$";
            break;
        case 'numletterchina': //汉字、字母、数字组成 
            objexp = "^[0-9a-zA-Z\u4e00-\u9fa5]+$";
            break;
        case 'email': //邮件地址格式 
            objexp = "^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$";
            break;  
        case 'tel': //固话格式 
            objexp = /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/;
            break;
        case 'mobile': //手机号码 
            objexp = "^(13[0-9]|15[0-9]|18[0-9])([0-9]{8})$";
            break;
        case 'decimal': //浮点数 
            objexp = "^[0-9]+([.][0-9]+)?$";
            break;
        case 'url': //网址 
            objexp = "(http://|https://){0,1}[\w\/\.\?\&\=]+";
            break;
        case 'date': //日期 YYYY-MM-DD格式
            objexp = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/;
            break;
        case 'int': //整数 
            objexp = "^[0-9]*[1-9][0-9]*$";
            break;
        case 'int+': //正整数包含0
            objexp = "^\\d+$";
            break;
        case 'int-': //负整数包含0
            objexp = "^((-\\d+)|(0+))$";
            break;
        case 'china': //中文 
            objexp = /^[\u0391-\uFFE5]+$/;
            break;
    }
    var re = new RegExp(objexp);
    if (re.test(s)) {
        return true;
    }
    else {
        return false;
    }
};

/*
* 获取控件的值
* @param controlID 控件ID
* @param controltype 类型 如text radio
* @return
*/
jQuery.mGetValue = function (controlID, controltype) {
    var objValue = "";
    switch (controltype) {
        case 'text': //文本输入框
            objValue = $.trim($("#" + controlID + "").attr("value")); //取值去左右空格
            break;
        case 'radio': //单选框
            objValue = $("input[name='" + controlID + "']:checked").attr("value");
            break;
        case 'select': //下拉列表
            objValue = $("#" + controlID + "").attr("value");
            break;
        case 'checkbox': //多选框
            $("input[name='" + controlID + "']:checked").each(function () {
                objValue += $(this).val() + ",";
            });
            break;
        default:
            break;
    }
    return objValue;
};

/*
* 设置控件的值
* @param controlID 控件ID
* @param controltype 类型 如text radio
* @param controlvalue 绑定值
* @return
*/
jQuery.mSetValue = function (controlID, controltype, controlvalue) {
    switch (controltype) {
        case 'text': //文本输入框  
            //$("#txtUserID").attr("value", '这是绑定内容'); //填充内容  
            //$("input[name='radio1'][value='上海']").attr("checked", true); //单选组radio:设置value='上海'的项目为当前选中项  
            //$("#select1").attr("value", '葡萄牙'); //下拉框select:设置value='中国'的项目为当前选中项  
            //$("input[name='checkbox1'][value='黑色'],[value='蓝色']").attr("checked", true); //多选框:设置多个值为当前选中项  
            $("#" + controlID + "").attr("value", controlvalue); //填充内容  
            break;
        case 'radio': //单选框  
            $("input[name='" + controlID + "'][value='" + controlvalue + "']").attr("checked", true);
            break;
        case 'select': //下拉列表  
            $("#" + controlID + "").attr("value", controlvalue);
            break;
        case 'checkbox': //多选框  
            $("input[name='" + controlID + "'][value='" + controlvalue + "'],[value='" + controlvalue + "']").attr("checked", true); //多选框:设置多个值为当前选中项  
            break;
        default:
            break;
    }
};

/*
* 兼容IE火狐等浏览器的自动跳转
* @param url 跳转网址
* @return
*/
jQuery.mAutoNav = function (url) {
    if ($.browser.msie) {
        var referLink = document.createElement('a');
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    } else {
        location.href = url;
    }
};

/*
* Table表格奇偶行设置颜色及移动鼠标行变色
* @param table 表格ID
* @return
*/
jQuery.mTableHover = function (table) {
    $("#" + table).each(function () {
        var o = $(this);
        //设置偶数行和奇数行颜色
        o.find("tr:even").css("background-color", "#EFF3FB");
        o.find("tr:odd").css("background-color", "#FFFFFF");
        //鼠标移动隔行变色hover用法关键
        o.find("tr:not(:first)").hover(function () {
            $(this).attr("bColor", $(this).css("background-color")).css("background-color", "#E0E0E0");
        }, function () {
            $(this).css("background-color", $(this).attr("bColor"));
        });
    });
};

/*
* gridview 隔行换色 鼠标滑过变色 多选
* c#获取选择值 Request.Form.Get("chkItem")
* @param objgridview ID
* @return
*/
jQuery.mGridview = function (objgridview) {
    var headcolor = { background: '#E0ECFF', color: '#333' };
    var normalcolor = { background: '#f7f6f3' };
    var altercolor = { background: '#EDF1F8' };
    var hovercolor = { background: '#89A5D1' };
    var selectcolor = { background: '#ACBFDF' };
    var nullcolor = {};
    //get obj id
    var gridviewId = "#" + objgridview;
    //even
    $(gridviewId + ">tbody tr:even").css(normalcolor);
    //first
    $(gridviewId + ">tbody tr:first").css(nullcolor).css(headcolor);
    //odd
    $(gridviewId + ">tbody tr:odd").css(altercolor);
    //hover
    $(gridviewId + ">tbody tr").click(function () {
        var cb = $(this).find("input:checkbox");
        var chf = typeof (cb.attr("checked")) == "undefined" ? true : false;
        cb.attr("checked", chf);
        var expr1 = gridviewId + ' >tbody >tr >td >input:checkbox:checked';
        var expr2 = gridviewId + ' >tbody >tr >td >input:checkbox';
        var selectAll = $(expr1).length == $(expr2).length;
        $('#chkAll').attr('checked', selectAll);
    }).hover(function () {
        $(this).css(hovercolor);
    }, function () {
        $(gridviewId + ">tbody tr:even").css(normalcolor);
        $(gridviewId + ">tbody tr:first").css(nullcolor).css(headcolor);
        $(gridviewId + ">tbody tr:odd").css(altercolor);
    });

    //all check
    $("#chkAll").click(function () {
        $(gridviewId + '>tbody >tr >td >input:checkbox:visible').attr('checked', this.checked);
    });
    //check status
    $(gridviewId + ' >tbody >tr >td >input:checkbox').click(function () {
        var cb = $(this);
        var chf = typeof (cb.attr("checked")) == "undefined" ? true : false;
        cb.attr("checked", chf);
        var expr1 = gridviewId + ' >tbody >tr >td >input:checkbox:checked';
        var expr2 = gridviewId + ' >tbody >tr >td >input:checkbox';
        var selectAll = $(expr1).length == $(expr2).length;
        $('#chkAll').attr('checked', selectAll);
    });
};

/*
* 屏幕居中显示处理进度
* @param info 显示文字
* @param type 方式 0遮罩 1不遮罩
* @param typepic 图片 0:load 1:ok 2:error
* @return
*/
jQuery.mMaskLoad = function (info, type, typepic) {
    var pic = "";
    switch (typepic) {
        case 0: // loading
            pic = "./Images/loading.gif";
            break;
        case 1: // ok
            pic = "./Images/right.png";
            break;
        case 2: // error
            pic = "./Images/error.png";
            break;
        default: //其他任何值时
            pic = "./Images/loading.gif";
            break;
    }
    if (type == 0) {
        $("<div class=\"datagrid-mask\"></div>").css(
        {
            display: "block",
            width: "100%",
            position: "absolute",
            left: "0",
            top: "0",
            opacity: "0.3",
            height: "100%",
            filter: "alpha(opacity=30)",
            background: "#ccc"
        }).appendTo("body");
    };
    $("<div class=\"datagrid-mask-msg\"></div>").css(
        {
            position: "absolute",
            top: "50%",
            padding: "12px 5px 10px 30px",
            width: "auto",
            height: "16px",
            border: "1px solid #D1D1D1",
            background: "#ffffff url('" + pic + "') no-repeat scroll 5px center",
            display: "block",
            left: ($(document.body).outerWidth(true) - 190) / 2,
            top: ($(window).height() - 45) / 2
        }).html(info).appendTo("body");
};

/*
* 屏幕居中隐藏处理进度
* @return
*/
jQuery.mMaskLoadClose = function () {
    $(".datagrid-mask").remove();
    $(".datagrid-mask-msg").remove();
};

/*
* 控件后创建SPAN作为TIP提示
* @param o 用this
* @param tip 提示文字
* @param typepic 图片 0:load 1:ok 2:error
* @return
*/
jQuery.mTip = function (o, tip, typepic) {
    var pic = "";
    switch (typepic) {
        case 0: // loading
            pic = "./Images/loading.gif";
            break;
        case 1: // ok
            pic = "./Images/right.png";
            break;
        case 2: // error
            pic = "./Images/error.png";
            break;
        default: //其他任何值时
            pic = "./Images/loading.gif";
            break;
    }
    var eTip = document.createElement("span");
    var objid = $(o).attr("id") + "_tipDiv";
    var value = $(o).val();
    //绝对路径  
    var x = $(o).offset().top;
    var y = $(o).offset().left;
    var w = $(o).width();
    var h = $(o).height();
    eTip.setAttribute("id", objid);
    try {
        document.body.appendChild(eTip);
    } catch (e) { }
    $("#" + objid).hide();
    $("#" + objid).css({
        top: x,
        left: y + w + 10,
        height: h,
        position: "absolute"
    });
    $("#" + objid).html("<img src=\"" + pic + "\" style=\"vertical-align:bottom;margin-right:5px;\">" + tip);
    $("#" + objid).show();
};

/**
* ajax post提交
* @param url
* @param param
* @param datat 为html,json,text
* @param callback 回调函数 function callBack(data)
* @return
*/
jQuery.mJqAjax = function (url, param, datat, callback) {
    $.ajax({
        type: "post",
        url: url,
        data: param,
        dataType: datat,
        success: callback,
        error: function () { }
    });
};

/// <reference path="jquery-1.8.3.min.js" />
/*********************************************************************/
/***************************Jquery 扩展****************************/
/*********************************************************************/
jQuery.mIsNull = function (obj) {
    if (obj == "" || typeof (obj) == "undefined" || obj == null) {
        return true;
    }
    else {
        return false;
    }
};

jQuery.mCheckNull = function (id, tipid, nullmess, ctype) {
    var str = $.mGetValue(id, ctype);
    var tid = ($.mIsNull(tipid)) ? id : tipid;
    var obj = ($.mIsNull(tipid)) ? $.mTip : $.mTipCustom;
    if ($.mIsNull(str)) {
        obj("#" + tid, nullmess, 2);
    }
    else {
        obj("#" + tid, "", 1);
    }
};

jQuery.mCheckNullAndReg = function (id, tipid, nullmess, regmess, ctype, rtype) {
    var str = $.mGetValue(id, ctype);
    var tid = ($.mIsNull(tipid)) ? id : tipid;
    var obj = ($.mIsNull(tipid)) ? $.mTip : $.mTipCustom;
    if ($.mIsNull(str)) {
        obj("#" + tid, nullmess, 2);
    }
    else {
        if ($.mCheck(str, rtype)) {
            obj("#" + tid, "", 1);
        } else {
            obj("#" + tid, regmess, 2);
        }
    }
};

jQuery.mCheck = function (s, type) {
    var objbool = false;
    var objexp = "";
    switch (type) {
        case 'money': //金额格式,格式定义为带小数的正数,小数点后最多三位  
            objexp = "^[0-9]+[\.][0-9]{0,3}$";
            break;
        case 'numletter_': //英文字母和数字和下划线组成     
            objexp = "^[0-9a-zA-Z\_]+$";
            break;
        case 'numletter': //英文字母和数字组成  
            objexp = "^[0-9a-zA-Z]+$";
            break;
        case 'numletterchina': //汉字、字母、数字组成   
            objexp = "^[0-9a-zA-Z\u4e00-\u9fa5]+$";
            break;
        case 'email': //邮件地址格式   
            objexp = "^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$";
            break;
        case 'tel': //固话格式   
            objexp = /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/;
            break;
        case 'mobile': //手机号码   
            objexp = "^(13[0-9]|15[0-9]|18[0-9])([0-9]{8})$";
            break;
        case 'decimal': //浮点数   
            objexp = "^[0-9]+([.][0-9]+)?$";
            break;
        case 'url': //网址   
            objexp = "(http://|https://){0,1}[\w\/\.\?\&\=]+";
            break;
        case 'date': //日期 YYYY-MM-DD格式  
            objexp = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/;
            break;
        case 'int': //整数   
            objexp = "^[0-9]*[1-9][0-9]*$";
            break;
        case 'int+': //正整数包含0  
            objexp = "^\\d+$";
            break;
        case 'int-': //负整数包含0  
            objexp = "^((-\\d+)|(0+))$";
            break;
        case 'china': //中文   
            objexp = /^[\u0391-\uFFE5]+$/;
            break;
    }
    var re = new RegExp(objexp);
    if (re.test(s)) {
        return true;
    }
    else {
        return false;
    }
};

jQuery.mTip = function (o, tip, typepic) {
    var pic = "";
    switch (typepic) {
        case 0: // loading  
            pic = "/images/publicNew/loading.gif";
            break;
        case 1: // ok  
            pic = "/images/publicNew/right.png";
            break;
        case 2: // error  
            pic = "/images/publicNew/error.png";
            break;
        default: //其他任何值时  
            pic = "/images/publicNew/onLoad.gif";
            break;
    }
    var eTip = document.createElement("span");
    var objid = $(o).attr("id") + "_tipDiv";
    var value = $(o).val();
    //绝对路径    
    var x = $(o).offset().top;
    var y = $(o).offset().left;
    var w = $(o).width();
    var h = $(o).height();
    eTip.setAttribute("id", objid);
    try {
        document.body.appendChild(eTip);
    } catch (e) { }
    $("#" + objid).hide();
    $("#" + objid).css({
        top: x,
        left: y + w + 10,
        height: h,
        position: "absolute"
    });
    $("#" + objid).html("<img src=\"" + pic + "\" style=\"vertical-align:bottom;margin-right:5px;\">" + tip);
    $("#" + objid).show();
};

jQuery.mTipCustom = function (o, tip, typepic) {
    var pic = "";
    switch (typepic) {
        case 0: // loading  
            pic = "/images/publicNew/loading.gif";
            break;
        case 1: // ok  
            pic = "/images/publicNew/right.png";
            break;
        case 2: // error  
            pic = "/images/publicNew/error.png";
            break;
        default: //其他任何值时  
            pic = "/images/publicNew/onLoad.gif";
            break;
    }
    $("#" + o).html("<img src=\"" + pic + "\" style=\"vertical-align:bottom;margin-right:5px;\">" + tip);
    $("#" + o).show();
};

jQuery.mGetValue = function (controlID, controltype) {
    var objValue = "";
    switch (controltype) {
        case 'text': //文本输入框  
            objValue = $.trim($("#" + controlID + "").attr("value")); //取值去左右空格  
            break;
        case 'radio': //单选框  
            objValue = $("input[name='" + controlID + "']:checked").attr("value");
            break;
        case 'select': //下拉列表  
            objValue = $("#" + controlID + "").attr("value");
            break;
        case 'checkbox': //多选框  
            $("input[name='" + controlID + "']:checked").each(function () {
                objValue += $(this).val() + ",";
            });
            break;
        default:
            break;
    }
    return objValue;
};

/** 
* ajax post提交 
* @param url 
* @param param 
* @param datat 为html,json,text 
* @param callback 回调函数 function callBack(data) 
* @return 
*/
jQuery.mJqAjax = function (url, param, datat, callback) {
    $.ajax({
        type: "post",
        url: url,
        data: param,
        dataType: datat,
        success: callback,
        error: function () { }
    });
};

 

本文转载自:http://blog.csdn.net/smartsmile2012/article/details/18005107

深圳大道
粉丝 3
博文 877
码字总数 0
作品 0
深圳
架构师
私信 提问
基于jquery开发的UI框架有哪些

根据调查得知,现在市场中的UI框架差不多40个左右,不知大家都习惯性的用哪个框架,现在市场中有几款UI框架稍微的成熟一些,也是大家比较喜欢的一种UI框架,那应该是jQuery,有部分UI框架都是...

UIleader
2017/09/20
0
0
从零开始学 Web 之 jQuery(一)jQuery的概念,页面加载事件

大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:http://www.cnblogs.com/lvonve/ CSDN...

fengdaoting
2018/07/04
0
0
从零实现一个简易的jQuery框架之二—核心思路详解

如何读源码 整体框架甚是复杂,也不易读懂。但是若想要在前端的路上走得更远、更好,研究分析前端的框架无疑是进阶路上必经之路。但是庞大的源码往往让我们不知道从何处开始下手。在很长的时...

余大彬
2018/08/08
0
0
jQuery零基础入门——(八)AJAX

《jQuery零基础入门》系列博文是在廖雪峰老师的博文基础上,可能补充了个人的理解和日常遇到的点,用我的理解表述出来,主干出处来自廖雪峰老师的技术分享。 用JavaScript写AJAX前面已经介绍...

JandenMa
2018/08/06
29
0
JS杂谈系列-jquery-插件开发小记

//=======================start(function ($) {//扩展 必须$.fn.extend({ //插件名称 必须colh: function (options) {//默认参数 (放在插件外面,避免每次调用插件都调用一次,节省内存)va...

透笔度
2015/08/04
440
1

没有更多内容

加载失败,请刷新页面

加载更多

Qt程序打包发布方法(使用官方提供的windeployqt工具)

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/toTheUnknown/article/details/81748179 如果使用到了Qt ...

shzwork
37分钟前
7
0
MainThreadSupport

MainThreadSupport EventBus 3.0 中的代码片段. org.greenrobot.eventbus.MainThreadSupport 定义一个接口,并给出默认实现类. 调用者可以在EventBus的构建者中替换该实现. public interface ...

马湖村第九后羿
57分钟前
3
0
指定要使用的形状来代替文字的显示

控制手机键盘弹出的功能只能在ios上实现,安卓是实现不了的,所以安卓只能使用type类型来控制键盘类型,例如你要弹出数字键盘就使用type="number",如果要弹出电话键盘就使用type="tel",但这...

前端老手
今天
6
0
总结:Raft协议

一、Raft协议是什么? 分布式一致性算法。即解决分布式系统中各个副本数据一致性问题。 二、Raft的日志广播过程 发送日志到所有Followers(Raft中将非Leader节点称为Follower)。 Followers收...

浮躁的码农
今天
7
0
Flask-admin Model View字段介绍

Model View字段介绍 can_create = True 是否可以创建can_edit = True 是否可以编辑can_delete = True 是否可以删除list_template = 'admin/model/list.html' 修改显......

dillonxiao
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部