⼀个前端框架应该有的⼀些公共函数
⼀、防⽌ie浏览器按backspace回退页⾯
//防⽌后退返回页⾯，如果⾮⽂本框、密码框、⽂本域控件，或控件⾮可⽤装填，则禁⽤后退按键
var ua=LowerCase();
var isIE=ua.indexOf("msie")>-1;
keydown =function(e){
var e = e;
var obj; //事件源
var t; //控件类型
var keyCode; //按键ascii码
if(isIE){
e = event || window.event;
keyCode = e.keyCode;
}else{
keyCode = e.keyCode || e.which;
if(keyCode==undefined||keyCode==null||keyCode==''){
keyCode=String.fromCharCode(e.charCode);
}
}
obj = e.target || e.srcElement; //获取事件源
t = pe || Attribute('type');
if (e.keyCode==8 && (adOnly || obj.disabled || (t != "password" && t != "text" && t != "textarea" && obj.tagName!=='INPUT'))) { return false;
}
};
⼆、获取页⾯传参
// 获取参数
var name = window.location.search; //获取？后⾯的字符串
function getUrlParam(name) {
var urlArr = [],urlObj={};
name = decodeURI(name);
urlArr=name.substring(1).split('&');
for(var i =0;i<urlArr.length;i++){
var valueArr=urlArr[i].split('=');
urlObj[valueArr[0]]=valueArr[1];
}
return urlObj;
}
三、加载动画（避免重复点击机制），初始化ajax（以jquery为例）
1 jQuery.bootstrapLoading = {
2 start: function (options) {
3var defaults = {
4 opacity: 1,
5//loading页⾯透明度
6 backgroundColor: "rgba(0,0,0,0.3)",
7//loading页⾯背景⾊
8 borderColor: "#bbb",
9//提⽰边框颜⾊
10 borderWidth: 0,
11//提⽰边框宽度
12 borderStyle: "solid",
13//提⽰边框样式
14 loadingTips: "",
15//提⽰⽂本
16 TipsColor: "#666",
17//提⽰颜⾊
18 delayTime: 1000,
19//页⾯加载完成后，加载页⾯渐出速度
20 zindex: 99999999,
21//loading页⾯层次
22 sleep: 0,
23//设置挂起，等于0时则⽆需挂起
24 width: '150px',
25 height: '165px',
26 }
27var options = $.extend(defaults, options);
28
29//获取页⾯宽⾼
30var _PageHeight = document.documentElement.clientHeight,
31 _PageWidth = document.documentElement.clientWidth;
32//获取页⾯路径
33var baseUrl = window.document.location.protocol + "//" + window.document.location.host + "/";
34var shortenedUrl = window.document.place(baseUrl, "").replace(/\/\//g, "/").replace("//", "/");
35if(shortenedUrl.startsWith("/")){
36 shortenedUrl = shortenedUrl.substring(1);
37 }
38if(shortenedUrl.indexOf("web/")==0){
39 baseUrl = baseUrl + shortenedUrl.substring(0, shortenedUrl.indexOf("/"));
40 }
41//在页⾯未加载完毕之前显⽰的loading Html⾃定义内容
42var _LoadingHtml = '<div id="loadingPage" ><div id="loadingTips" class="loadingTips" >'
45 + options.loadingTips + '</div></div>';
46
47//呈现loading效果
48 $("body").append(_LoadingHtml);
49//获取loading提⽰框宽⾼
50var _LoadingTipsH = ElementById("loadingTips").clientHeight,
51 _LoadingTipsW = ElementById("loadingTips").clientWidth;
52
53//计算距离，让loading提⽰框保持在屏幕上下左右居中
54var _LoadingTop = _PageHeight > _LoadingTipsH ? (_PageHeight - _LoadingTipsH) / 2 : 0,
55 _LoadingLeft = _PageWidth > _LoadingTipsW ? (_PageWidth - _LoadingTipsW) / 2 : 0;
56
57 $(".loadingTips").css({
58 "left": _LoadingLeft + "px",
59 "top": _LoadingTop + "px"
60 });
前端有哪些常用框架61
62//监听页⾯加载状态
63// adystatechange = PageLoaded;
64
65//当页⾯加载完成后执⾏
66// function PageLoaded() {
67// if (adyState == "complete") {
68// var loadingMask = $('#loadingPage');
69
70// setTimeout(function () {
71// loadingMask.animate({
72// "opacity": 0
73// },
74// options.delayTime,
75// function () {
76// $(this).hide(); 77
78// });
79
80// },
81// options.sleep);
82
83// }
84// }
85 },
86 end: function () {
87 $("#loadingPage").remove();
88 }
89 }
90//初始化ajax
91 $.ajaxSetup({
92 beforeSend:function(xhr){
93 $.bootstrapLoading.start();
94 },
95 complete: function () {
96 $.d();
97 }
98 });
4、时间格式化
Date.prototype.format=function(fmt) {
var o = {
"M+" : Month()+1, //⽉份
"d+" : Date(), //⽇
"h+" : Hours()%12 == 0 ? 12 : Hours()%12, //⼩时
"H+" : Hours(), //⼩时
"m+" : Minutes(), //分
"s+" : Seconds(), //秒
"q+" : Math.floor((Month()+3)/3), //季度
"S" : Milliseconds() //毫秒
};
var week = {
"0" : "/u65e5",
"1" : "/u4e00",
"2" : "/u4e8c",
"3" : "/u4e09",
"4" : "/u56db",
"5" : "/u4e94",
"6" : "/u516d"
};
if(/(y+)/.test(fmt)){
place(RegExp.$1, (FullYear()+"").substr(4 - RegExp.$1.length));
}
if(/(E+)/.test(fmt)){
place(RegExp.$1, ((RegExp.$1.length>1) ? (RegExp.$1.length>2 ? "/u661f/u671f" : "/u5468") : "")+Day()+""]); }
for(var k in o){
if(new RegExp("("+ k +")").test(fmt)){
fmt = place(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
}
}
return fmt;
}
function getDate(strDate){
if(strDate && strDate!=""){
var date = eval('new Date(' + place(/\d+(?=-[^-]+$)/, function (a) { return parseInt(a, 10) - 1; }).match(/\d+/g) + ')');
return date;
}
return undefined;
}
function formatDate(date, fmt){
var format = fmt || "yyyy-MM-dd hh:mm:ss";
if(date instanceof Date){
return date.format(format);
}else if(typeof date == 'string'){
var d = getDate(date);
if(d){
return d.format(format);
}
return '';
}else{
return date;
}
}
5、格式化数据（树状结构）
1 TreeDataFormat = {
2 format : function(conf) {
3var idField, textField, parentField, iconClsField;
4 idField = conf.idField || 'id';
5 textField = Field || 'text';
6 parentField = conf.parentField || 'pid';
7 iconClsField = conf.iconClsField || 'iconCls';
8 data = conf.data
9var i, l, treeData = [], tmpMap = [];
10for (i = 0, l = data.length; i < l; i++) {
11 data[i]['id'] = data[i][idField];
12 data[i]['text'] = data[i][textField];
13 data[i]['pid'] = data[i][parentField];
14 data[i]['iconCls'] = data[i][iconClsField] || 'anticon icon-nav';
15 data[i]['children'] = [];
16 tmpMap[data[i][idField]] = data[i];
17 }
18for (i = 0, l = data.length; i < l; i++) {
19if (tmpMap[data[i][parentField]] && data[i][idField] != data[i][parentField]) { 20if (!tmpMap[data[i][parentField]]['children'])
21 tmpMap[data[i][parentField]]['children'] = [];
22 data[i][parentField]
23 data[i]['text'] = data[i][textField];
24 tmpMap[data[i][parentField]]['children'].push(data[i]);
25 } else {
26 data[i]['text'] = data[i][textField];
27 treeData.push(data[i]);
28 }
29 }
30return treeData;
31 },
32 getChildrenByPid:function(treeData, pidField, pid, result){
33 result = result || [];
34for (var i = 0; i < treeData.length; i++) {
35if (treeData[i][pidField] === pid)
36 result.push(treeData[i]);
37else {
38if (treeData[i].hasOwnProperty("children")) {
39 result = ChildrenByPid(treeData[i].children, pidField, pid, result);
40 }
41 }
42 }
43return result;
44 }
45 }
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论