工作常用的工具类JS+reset.css

var tools = (function() {var _urlIndex = '请求的域名'/*** POST 请求*/function doPost(url, params, callback, errorCallback) {url = _urlIndex + url;$.ajax({type: "POST",url: url,dataType: "json",contentType: "application/x-www-form-urlencoded;charset=UTF-8",// data: JSON.stringify(params), application/json;charset=UTF-8data:params,success: function(responseJson) {callback(responseJson);},error: errorCallback});};/*** GET 请求*/function doGet(url, params, callback) {url = _urlIndex + url;$.ajax({url: url,type: 'GET',data: params,dataType: 'json',success: function(respondeData) {callback(respondeData);}});};// 把参数添加到url上function addParamsForUrl(url, params) {if (typeof params !== "object") return urlfor (var key in params) {if (params.hasOwnProperty(key)) {if (params[key] && params[key] != 'undefined') {if (url.indexOf('?') != -1) {url += '&' + '' + key + '=' + params[key] || '' + ''} else {url += '?' + '' + key + '=' + params[key] || '' + ''}}}}return url};// 判断是否为空function isEmpty(val) {if (val == null || typeof(val) == 'undefined' ||(typeof(val) == 'string' && (trim(val) == '' || trim(val) == 'null'))) {return true;} else {return false;}};// 清除前后空格function trim(val) {return val.replace(/(^\s*)|(\s*$)/g, '');};// 清除所有空格let str1=' 1 23 1233 123 123 'str1 = str1.replace(/\s*/g,"");// 清除左边空格   str1 = str1.replace(/^\s*/g,"")// 清除右边空格str1 = str1.replace(/(\s*$)/g,"")// 大于等于0，整数5位，可以包含2位小数，不能是0.0 0.00// (?!^0\.0?0$) 正向否定查找 仅仅当没有0.0 0.00匹配后面的逻辑 简单讲就是过滤掉0.0 0.00这两个条件，在进行后面的查找const decReg=/(?!^0\.0?0$)^(0|([1-9]\d{0,4}))(\.\d{1,2})?$/// 字符串按照多少位进行空格分隔// 匹配\w{4}，仅当后面跟着\w  \w 字母数字下划线let str='1231232132312323213213'str = str.replace(/(\w{4})(?=\w)/g, '$1 ')// 判断是安卓手机还是苹果手机function iosOrAndroid() {var u = navigator.userAgent;var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端if (isiOS == true) {return isiOS;} else {return isAndroid;}};// 验证身份证function isIdentityCardNo(card) {var pattern = /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/;return pattern.test(card);};//号码验证正则function regPhone(phone) {var regPhone = /^1[3|4|5|6|7|8][0-9]{9}$/;return regPhone.test(phone)};/*** 手机号码验证运营商* 移动：134(0 - 8) 、135、136、137、138、139、147、150、151、152、157、158、159、178、182、183、184、187、188、198 * 联通：130、131、132、145、155、156、175、176、185、186、166* 电信：133、153、173、177、180、181、189、199 * */function regPhoneType(phone) {var $CM = /^((13[456789])|(147)|(15[012589])|(178)|(18[2348])|(198))\d{8}$/g,$CU = /^((13[012])|(145)|(15[56])|(166)|(17[0156])|(18[56]))\d{8}$/g,$CT = /^((133)|(153)|(17[37])|(18[019])|(199))\d{8}$/g;if ($CM.test(phone)) {return { type: 'zgyd', name: '中国移动' }}if ($CU.test(phone)) {return { type: 'zglt', name: '中国联通' }}if ($CT.test(phone)) {return { type: 'zgdx', name: '中国电信' }}return { type: null, name: '' }};// 邮箱验证正则function regEmail(email) {var regEmail = /^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/;return regEmail.test(email)};//从 canvas 提取图片 base64 imagefunction convertCanvasToImage(canvas) {//新Image对象，可以理解为DOM//alert(typeof(canvas));var image = new Image();// canvas.toDataURL 返回的是一串Base64编码的URL，当然,浏览器自己肯定支持// 指定格式 PNGimage.src = canvas.toDataURL("image/png");return image;};// 把base64 转换成文件对象function dataURLtoFile(base64Str, fileName) {var arr = base64Str.split(','),mime = arr[0].match(/:(.*?);/)[1],bstr = atob(arr[1]), //对base64串进行操作，去掉url头，并转换为bytelen = bstr.length,ab = new ArrayBuffer(len), //将ASCII码小于0的转换为大于0u8arr = new Uint8Array(ab);while (len--) {u8arr[len] = bstr.charCodeAt(len)};// 创建新的 File 对象实例[utf-8内容，文件名称或者路径，[可选参数，type：文件中的内容mime类型]]return new File([u8arr], fileName, {type: mime})};/*** 自定义提示框* 显示信息用于请求回调的错误信息显示* 需要检查reset.css中是否有tipsBox样式* @param {*} str */function showMsg(str, time) {time = time || 1500;var timer1 = null,timer2 = null;// 判断是否已经存在tipsbox元素，如果存在就不用添加了var oldtipsbox = document.getElementById('tipsbox');if (oldtipsbox != null) {clearTimeout(timer1);oldtipsbox.getElementsByClassName('tips')[0].innerHTML = str;oldtipsbox.style.display = "flex";timer1 = window.setTimeout(function() {oldtipsbox.style.display = "none";}, time)} else {clearTimeout(timer2);var fragment = document.createDocumentFragment();var tipsbox = document.createElement('div');var tips = document.createElement('div');tipsbox.setAttribute("class", "tipsbox");tipsbox.setAttribute("id", "tipsbox");tips.setAttribute("class", "tips");tips.innerHTML = str;tipsbox.appendChild(tips);fragment.appendChild(tipsbox);// 把文档碎片添加到body中document.body.appendChild(fragment);//  默认显示的时间timer2 = window.setTimeout(function() {tipsbox.style.display = "none";}, time)}};/*** 自定义显示loading*/function showLoading() {var oldLoadingBox = document.getElementById("loadingBox");if (oldLoadingBox != null) {oldLoadingBox.style.display = 'flex';} else {var fragment = document.createDocumentFragment();var loadingBox = document.createElement('div');loadingBox.setAttribute('class', 'loadingBox');loadingBox.setAttribute('id', 'loadingBox');var containerStr = '<div class="spinner">' +'<div class="spinner-container container1">' +'<div class="circle1"></div>' +'<div class="circle2"></div>' +'<div class="circle3"></div>' +'<div class="circle4"></div>' +'</div>' +'<div class="spinner-container container2">' +'<div class="circle1"></div>' +'<div class="circle2"></div>' +'<div class="circle3"></div>' +'<div class="circle4"></div>' +'</div>' +'<div class="spinner-container container3">' +'<div class="circle1"></div>' +'<div class="circle2"></div>' +'<div class="circle3"></div>' +'<div class="circle4"></div>' +'</div>' +'</div>';loadingBox.innerHTML = containerStr;loadingBox.style.display = 'flex';fragment.appendChild(loadingBox);// 把文档碎片添加到body中document.body.appendChild(fragment);}};/*** 隐藏loading*/function hideLoading() {var loadingBox = document.getElementById('loadingBox');loadingBox.style.display = 'none'};// 判断是否是微信浏览器环境function isWeiXin() {var ua = window.navigator.userAgent.toLowerCase();if (ua.match(/MicroMessenger/i) == 'micromessenger' || ua.match(/_SQ_/i) == '_sq_') {return true;} else {return false;}};/*** 获取临时URL地址，用于图片回显*/function getObjectURL(file) {var url = null;if (window.createObjectURL != undefined) {// 正常浏览器url = window.createObjectURL(file)} else if (window.URL != undefined) {// mozilla firefoxurl = window.URL.createObjectURL(file);} else if (window.webkitURL != undefined) {// webkit chromeurl = window.webkitURL.createObjectURL(file);}return url};/*** 时间格式化*/function dateFormat(value, format) {let nowDate = new Date(value),year = nowDate.getFullYear(),month = (nowDate.getMonth() + 1).toString().padStart(2, "0"),day = (nowDate.getDate()).toString().padStart(2, "0"),ymd = null;if (format == "yyyy-mm-dd") {ymd = year + "-" + month + "-" + day;} else if (format == "yyyy-mm") {ymd = year + "-" + month;} else {ymd = year + "年" + month + "月" + day + "日";}return ymd};/*** *获取cookie*/function getCookie(c_name) {var c_start = null,c_end = null;if (document.cookie.length > 0) {c_start = document.cookie.indexOf(c_name + "=")if (c_start != -1) {c_start = c_start + c_name.length + 1c_end = document.cookie.indexOf(";", c_start)if (c_end == -1) c_end = document.cookie.lengthreturn unescape(document.cookie.substring(c_start, c_end))}}return ""};/*** 设置cookie*/function setCookie(c_name, value, expiredays) {var exdate = new Date();exdate.setDate(exdate.getDate() + expiredays);document.cookie = c_name + "=" + escape(value) +((expiredays == null) ? "" : ";expires=" + exdate.toGMTString()) + ';path=/';};/*** 获取当前页面导航参数值*/function getQueryString(name) {var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");var r = window.location.search.substr(1).match(reg);if (r != null) return unescape(r[2]);return null;};function appendParams(url, params) {if (params) {var baseWithSearch = url.split('#')[0];var hash = url.split('#')[1];for (var key in params) {var attrValue = params[key];if (attrValue !== undefined) {var newParam = key + "=" + attrValue;if (baseWithSearch.indexOf('?') > -1) {var oldParamReg = new RegExp('^' + key + '=[-%.!~*\'\(\)\\w]*', 'g');if (oldParamReg.test(baseWithSearch)) {baseWithSearch = baseWithSearch.replace(oldParamReg, newParam);} else {baseWithSearch += "&" + newParam;}} else {baseWithSearch += "?" + newParam;}}}if (hash) {url = baseWithSearch + '#' + hash;} else {url = baseWithSearch;}}return url;};return {doPost,doGet,isEmpty,iosOrAndroid,isIdentityCardNo,regPhone,regPhoneType,convertCanvasToImage,dataURLtoFile,showMsg,showLoading,hideLoading,addParamsForUrl,isWeiXin,getObjectURL,regEmail,dateFormat,setCookie,getCookie,getQueryString,appendParams}
})();

// 初始化样式，包含上述工具中的loading 和 showmsg   样式html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
div,
section,
span,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
a,
img,
i,
em,
s,
del,
button,
input,
textarea,
th,
td {box-sizing: border-box;outline: 0;padding: 0;margin: 0;border: 0;-webkit-tap-highlight-color: transparent
}body {width: 100%;font-style: normal;font-family: "PingFangSC-Medium", "Microsoft YaHei", "微软雅黑", "PingFang-SC", "Arial", "Helvetica", "sans-serif";font-size: .28rem;
}small {font-size: 12px
}h1 {font-size: 18px
}h2 {font-size: 16px
}h3 {font-size: 14px
}h4,
h5,
h6 {font-size: 100%
}ul,
ol {list-style: none
}a {display: block;text-decoration: none;background-color: transparent
}a:hover,
a:active,
a:focus {outline-width: 0;text-decoration: none;
}table {border-collapse: collapse;border-spacing: 0
}hr {border: 0;height: 1px
}img {border-style: none
}img:not([src]) {display: none
}svg:not(:root) {overflow: hidden
}html {-webkit-touch-callout: none;-webkit-text-size-adjust: 100%
}input,
textarea,
button,
a {-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}input,
textarea {border: 0 none;outline: 0 none;display: block;width: 100%;height: 100%
}input[type='text'],
input[type='search'],
input[type="number"],
input[type='text']:focus,
input[type="number"]:focus,
input[type='text']:hover,
input[type="number"]:hover,
input[type='text']:checked,
input[type="number"]:checked,
textarea {text-decoration: none;-webkit-appearance: none;background: transparent
}input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color: #7A818C;font-size: 14px
}input:-moz-placeholder,
textarea::-webkit-input-placeholder {color: #7A818C;font-size: 14px
}input::-moz-placeholder,
textarea::-webkit-input-placeholder {color: #7A818C;font-size: 14px
}input::-ms-input-placeholder,
textarea::-webkit-input-placeholder {color: #7A818C;font-size: 14px
}article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {display: block
}audio,
canvas,
progress,
video {display: inline-block
}audio:not([controls]),
video:not([controls]) {display: none;height: 0
}progress {vertical-align: baseline
}mark {background-color: #ff0;color: #000
}sub,
sup {position: relative;font-size: 75%;line-height: 0;vertical-align: baseline
}sub {bottom: -0.25em
}sup {top: -0.5em
}button,
input,
select,
textarea {font-size: 100%;outline: 0
}button,
input {overflow: visible
}button,
select {text-transform: none
}textarea {overflow: auto
}button,
html [type="button"],
[type="reset"],
[type="submit"] {-webkit-appearance: button
}button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {border-style: none;padding: 0
}button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {outline: 1px dotted ButtonText
}[type="checkbox"],
[type="radio"] {box-sizing: border-box;padding: 0
}[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {height: auto
}[type="search"] {-webkit-appearance: textfield;outline-offset: -2px
}[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {-webkit-appearance: none
}::-webkit-input-placeholder {color: inherit;opacity: .54
}::-webkit-file-upload-button {-webkit-appearance: button;font: inherit
}.clearfix:after {display: block;height: 0;content: "";clear: both
}/* 提示框样式 */
.tipsbox {-webkit-box-align: center;align-items: center;-webkit-box-pack: center;justify-content: center;display: -webkit-box;display: flex;width: 100%;height: 100%;position: fixed;top: 0;left: 0;bottom: 0;z-index: 90000
}.tipsbox .tips {padding: .4rem .3rem;background: rgba(0, 0, 0, 0.7);border-radius: 12px;color: #fff;font-size: .28rem;max-width: 6.0rem;line-height: .6rem;text-align: center
}/* flex 公用样式 */
.d-flex {display: -webkit-box;display: flex;
}.flex-1 {-webkit-box-flex: 1;flex: 1;
}.flex-column {-webkit-box-orient: vertical !important;-webkit-box-direction: normal !important;flex-direction: column !important;
}.flex-row {-webkit-box-orient: horizontal !important;-webkit-box-direction: normal !important;flex-direction: row !important;
}.flex-wrap {flex-wrap: wrap !important;
}.justify-content-start {-webkit-box-pack: start !important;justify-content: flex-start !important;
}.justify-content-end {-webkit-box-pack: end !important;justify-content: flex-end !important;
}.justify-content-center {-webkit-box-pack: center !important;justify-content: center !important;
}.justify-content-between {-webkit-box-pack: justify !important;justify-content: space-between !important;
}.align-items-center {-webkit-box-align: center !important;align-items: center !important;
}.align-items-stretch {-webkit-box-align: stretch !important;align-items: stretch !important;
}/* loading样式区域 */
.loadingBox {position: fixed;top: 0;left: 0;bottom: 0;right: 0;z-index: 10001;width: 100%;background: rgba(0, 0, 0, 0.4);/* TWEENER - IE 10 */display: -webkit-box;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;-webkit-box-pack: center;-moz-justify-content: center;justify-content: center;-webkit-box-align: center;-moz-align-items: center;align-items: center;
}.loadingBox .loding-tips {line-height: .9rem;font-size: .32rem;color: #fff;
}.spinner {width: 30px;height: 30px;position: relative;
}.spinner .spinner-container {position: absolute;width: 100%;height: 100%;
}.container1>div,
.container2>div,
.container3>div {width: 8px;height: 8px;background-color: #F13115;border-radius: 100%;position: absolute;-webkit-animation: bouncedelay 1.2s infinite ease-in-out;animation: bouncedelay 1.2s infinite ease-in-out;-webkit-animation-fill-mode: both;animation-fill-mode: both;
}.container2 {-webkit-transform: rotateZ(45deg);transform: rotateZ(45deg);
}.container2 .circle1 {-webkit-animation-delay: -1.1s;animation-delay: -1.1s;
}.container3 {-webkit-transform: rotateZ(90deg);transform: rotateZ(90deg);
}.container3 .circle1 {-webkit-animation-delay: -1s;animation-delay: -1s;
}.circle1 {top: 0;left: 0;
}.circle2 {top: 0;right: 0;
}.circle3 {right: 0;bottom: 0;
}.circle4 {left: 0;bottom: 0;
}.container1 .circle2 {-webkit-animation-delay: -0.9s;animation-delay: -0.9s;
}.container2 .circle2 {-webkit-animation-delay: -0.8s;animation-delay: -0.8s;
}.container3 .circle2 {-webkit-animation-delay: -0.7s;animation-delay: -0.7s;
}.container1 .circle3 {-webkit-animation-delay: -0.6s;animation-delay: -0.6s;
}.container2 .circle3 {-webkit-animation-delay: -0.5s;animation-delay: -0.5s;
}.container3 .circle3 {-webkit-animation-delay: -0.4s;animation-delay: -0.4s;
}.container1 .circle4 {-webkit-animation-delay: -0.3s;animation-delay: -0.3s;
}.container2 .circle4 {-webkit-animation-delay: -0.2s;animation-delay: -0.2s;
}.container3 .circle4 {-webkit-animation-delay: -0.1s;animation-delay: -0.1s;
}@-webkit-keyframes bouncedelay {0%,100%,80% {-webkit-transform: scale(0);}40% {-webkit-transform: scale(1);}
}@keyframes bouncedelay {0%,100%,80% {transform: scale(0);-webkit-transform: scale(0);}40% {transform: scale(1);-webkit-transform: scale(1);}
}

// find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。// 对比一个数组中是否包含了另一个数组的值var A =[1,2,3,4,5]var B =[2,3,4,5,56]A.find(item=>B.includes(item)) //如果没有相同项，结果是undefined

工作常用的工具类JS+reset.css相关推荐

常用并发工具类（锁和线程间通信工具类）
常用并发工具类总结 JUC 下的常用并发工具类(锁和线程间通信工具类),主要包括 ReentrantLock.ReentrantReadWriteLock.CountDownLatch.CyclicB ...
java并发编程中常用的工具类 Executor
/*************************************************** * TODO: description . * @author: gao_chun * ...
Vue-一些常用的工具类
本文介绍一些常用的工具类 1.验证码如下图,一般的后台管理系统都会在登录的时候设计一个验证码,这个验证码是前端生成的,点击canvas可以切换验证码.二维码的类型是数字或者字母自己可以根据需要设置, ...
java web 项目常用小工具类 ~~~~
java web 项目常用小工具类 ~~~~ 一 .DateUtil 日期工具类 package com.devframe.common.util;import java.text.Simple ...
Android项目中常用的工具类集（史上最全整理）
如果你是一名有经验的Android开发者,那么你一定积累了不少的工具类,这些工具类是帮助我们快速开发的基础.如果你是新手,那么有了这些辅助类,可以让你的项目做起来更加的简单. 下面介绍一个在GitHu ...
Android常用的工具类
2019独角兽企业重金招聘Python工程师标准>>> 最新最准确内容建议直接访问原文:Android常用的工具类主要介绍总结的Android开发中常用的工具类,大部分同样适用于J ...
常用JSON工具类JsonUtil封装
前言项目中经常会有String转Object以及Object转Json字符串的需求,故封装一个常用Json工具类 Maven依赖 <dependency><groupId>o ...
java中常用的工具类
1. 常用零散工具类 1.1[DateUtil.java]日期处理的工具类 /*** 时间日期处理工具* String -> Date* Date -> String* 以及生成含有日期的 ...
java常用工具类和Hutool常用的工具类整理
java常用工具类和Hutool常用的工具类整理 1.java常用工具类 1.1 Scanner类 /*** Scanner 类*/@Testpublic void testScanner() {Sc ...

工作常用的工具类JS+reset.css

工作常用的工具类JS+reset.css相关推荐

最新文章

热门文章