# 常用代码片段 CommonCodeSnippets
# 获取两个数之间的随机数
//封装随机数函数
function getRandom(n,m) {
return parseInt(Math.random()*(m - n + 1) + n); //+1把最后一个数也能取到
}
1
2
3
4
2
3
4
# 获取页面滚动的高度
window.onscroll = function () {
// 兼容性处理
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
}
1
2
3
4
2
3
4
# 设置rem
function setHTML() {
// 基础值
var baseVal = 100;
// 设计稿的宽度
var pageWidth = 375;
// 要适配的屏幕的宽度?
var screenWidth = document.querySelector("html").offsetWidth;
// 要设置的fontsize
var fontsize = screenWidth * baseVal / pageWidth;
// 设置到html标签的中
document.querySelector("html").style.fontSize = fontsize + "px";
}
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
# 常用正则表达式
//验证邮箱
/^\w+@([0-9a-zA-Z]+[.])+[a-z]{2,4}$/
//验证手机号
/^1[3|5|8|7]\d{9}$/
//验证URL
/^http:\/\/.+\./
//验证身份证号码
/(^\d{15}$)|(^\d{17}([0-9]|X|x)$)/
//匹配字母、数字、中文字符
/^([A-Za-z0-9]|[\u4e00-\u9fa5])*$/
//匹配中文字符
/[\u4e00-\u9fa5]/
//匹配双字节字符(包括汉字)
/[^\x00-\xff]/
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
# 正则获取url中的参数
// 正则获取地址栏id
//function getUrl(name) { 与下方定义函数的方式相同
getUrl: function (name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURI(r[2]);
return null;
}
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 正则验证手机号码
function checkPhone(phone) {
if (!(/^1[34578]\d{9}$/.test(phone))) {
return false;
} else {
return true;
}
}
1
2
3
4
5
6
7
2
3
4
5
6
7
# 正则验证码邮箱
function checkEmail(myemail) {
var myReg = /^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;
if (myReg.test(myemail)) {
return true;
} else {
return false;
}
}
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 把对象格式的参数转成键值对，并以&分割
/**
* 把对象格式的参数转成键值对，并以&分割
* @param arr 要转换的对象参数
* @returns {string}
*/
function maiyaBuildParam(arr){
var result = '';
for(var key in arr)
{
result += key + "=" + encodeURIComponent(arr[key]) + "&";
}
result = result.substr(0,result.length-1);
return result;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
# 时间格式化
使用方式
new Date().format('yyyy-MM-dd'); // "2017-02-18"
new Date().format('yyyy-MM-dd hh-mm-ss'); // "2017-02-18 04-41-08"
new Date().format('yyyy-MM-dd hh/mm/ss'); // "2017-02-18 04/41/18"
new Date().format('yyyy-MM-dd HH/mm/ss'); // "2017-02-18 16/42/30"
new Date().format('yyyy-MM-dd E HH/mm/ss'); //"2017-02-18 六 16/51/16"
new Date().format('yyyy-MM-dd EE HH/mm/ss'); //"2017-02-18 周六 16/51/30"
new Date().format('yyyy-MM-dd EEE HH/mm/ss'); //"2017-02-18 星期六 16/51/77"
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
源码
Date.prototype.format = function (fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours() % 12 == 0 ? 12 : this.getHours() % 12, //12小时
"H+": this.getHours(), //24小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
var week = {
"0": "日",
"1": "一",
"2": "二",
"3": "三",
"4": "四",
"5": "五",
"6": "六"
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
}
if (/(E+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, ((RegExp.$1.length > 1) ? (RegExp.$1.length > 2 ? "星期" : "周") : "") + week[this.getDay() + ""]);
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
# 阻止默认行为
// 原生js
document.getElementById('btn').addEventListener('click', function (event) {
event = event || window.event；
if (event.preventDefault){
// w3c方法 阻止默认行为
event.preventDefault();
} else{
// ie 阻止默认行为
event.returnValue = false;
}
}, false);
// =====================================================================
// jQuery
$('#btn').on('click', function (event) {
event.preventDefault();
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 阻止冒泡
// 原生js
document.getElementById('btn').addEventListener('click', function (event) {
event = event || window.event；
if (event.stopPropagation){
// w3c方法 阻止冒泡
event.stopPropagation();
} else{
// ie 阻止冒泡
event.cancelBubble = true;
}
}, false);
// ==========================================================================
// jQuery
$('#btn').on('click', function (event) {
event.stopPropagation();
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# JS读取与解析本地文本类文件
// 已知file就是文件对象
var reader = new FileReader();
reader.onload = function (event) {
// event.target.result就是文件文本内容
// 然后你就可以为所欲为了
// 例如如果是JSON数据可以解析
// 如果是HTML数据，可以直接插入到页面中
// 甚至字幕文件，各种滤镜，自定义文件格式，都可以玩弄于鼓掌之间……
};
reader.readAsText(file);
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10