Ajax封装类,所有的Ajax都需要通过此方法进行发送 以便进行相应的Ajax方式管理

2017/07/06 ajax,httprequest

发这个贴的原因,是因为 是因为 是因为啥来着,忘了 那就是因为你,因为你 。

代码

/**
 * @author 第一作者:张建新
 * Ajax封装类,所有的Ajax都需要通过此方法进行发送 以便进行相应的Ajax方式管理
 * 注意 $.support.cors = true; 用来解决Ajax跨域问题,此方法需要和后台数据接口相配合
 * successFun,errorFun,beforeSendFun,completeFun
 * 示例写法
 * var successFun = function functionName(data)
 * {
 * 		对Ajax解析过来的数据进行渲染
 * }
 * 将successFun作为参数传入方法中
 * @param {Object} actionUrl 数据请求地址
 * @param {Object} parems Ajax参数列表
 * @param {Object} sendMethod 发送方式
 * @param {Object} successFun 请求成功后回调函数
 * @param {Object} errorFun 请求错误时回调函数
 * @param {Object} beforeSendFun 在发送请求之前回调函数
 * @param {Object} completeFun 请求完成后回调函数 (请求成功或失败之后均调用)
 */
function ajaxLoad(actionUrl,parems,sendMethod,successFun,errorFun,beforeSendFun,completeFun){
	/**解决ajax跨域问题*/
	$.support.cors = true;
	$.ajax( {
		url :actionUrl, /**请求的url地址*/
		dataType : "json", /**返回格式为json*/
		async : true,/**请求是否异步,默认为异步,这也是ajax重要特性 */
		data : parems, /**参数值*/
		type :sendMethod, /**请求方式*/
		/** 状态*/
		beforeSend :beforeSendFun,
		success : successFun,
		complete : completeFun,
		error :errorFun
	});
}

Toast显示框


/*
 * 是否正在Toast通知
 */
 
var isToasting = false;
/*
 * Toast通知
 */
function Toast(toastText){
	/*如果正在显示通知*/
	if(isToasting){
		/*延时3秒回调方法*/
		setTimeout(function(){
			Toast(toastText)
		},3000);
	}else{
		/*设置正在显示通知*/
		isToasting = true;
		/*创建通知控件*/
		var toast = document.createElement("div");
		/*设置通知文本*/
		toast.innerHTML = toastText;
		/*设置通知样式*/
		toast.className = "Toast";
		/*延时3秒销毁控件*/
		setTimeout(function(){	
			document.body.removeChild(toast);
			isToasting = false;
		},3000);
		/*显示控件*/
		document.body.appendChild(toast);
	}
}

Echart echarts-utils


/*
 * 参数列表
 * title 雷达图标题 字符串
 * subTitle 雷达图子标题 字符串
 * analyzeItems 分析项目 字符串数组 如分析北京 上海 广州 的农业林业牧业副业渔业 ['北京','上海','广州']
 * kindItems 雷达图对比分类 如事故分类 农业 林业 牧业 副业 渔业    ['农业', '林业', '牧业', '副业', '渔业']
 * datas对应行业的参数的二维数组,注意父数组长度对应对比分类 子数组长度应与分析项目长度相同,对应相应的对比项目下的分类的参数 如[[10,20,50],[30,80,100],[500,600,200],[700,800,900],[100,200,300]]
 */
function initRaderMap(title,
	analyzeItems,
	datas, drawPictureDiv,pictrueType,yTitle) {
	var myChart = echarts.init(document.getElementById(drawPictureDiv));

	option = {
		title: {
			text: title,
			x: 'center'
		},
		tooltip: {
			trigger: 'axis'
		},
		legend: {
			orient: 'horizontal',/**默认为 水平布局,垂直布局为 'vertical*/
			padding: 3,
			data: analyzeItems,
			x: 'center',
			y: 'bottom'
		},
		toolbox: {
			show: true,
			feature: {
				mark: {
					show: true
				},
				dataView: {
					show: false,
					readOnly: false
				},
				magicType: {
					show: true,
					type: ['line', 'bar', 'stack', 'tiled']
				},
				restore: {
					show: false
				},
				saveAsImage: {
					show: true
				}
			}
		},
		calculable: true, /**启用拖拽重计算特性*/
		xAxis: [{
			type: 'category',
           /**	boundaryGap: false,*/
			data: getXAxisData(datas)
		}],
		yAxis: [{
			type: 'value',
			name:yTitle,
			axisLabel : {
                formatter: '{value}'      
            }
		}],
		series : getSeriesData(analyzeItems, datas, pictrueType)
	};
	myChart.setOption(option);
}
/**
 * 获取分析指标参数
 * @param {Object} kindItems 雷达图对比分类 如事故分类 农业 林业 牧业 副业 渔业    ['农业', '林业', '牧业', '副业', '渔业']
 * @param {Object} datas datas对应行业的参数的二维数组,注意父数组长度对应对比分类 子数组长度应与分析项目长度相同,对应相应的对比项目下的分类的参数 如[[10,20,50],[30,80,100],[500,600,200],[700,800,900],[100,200,300]]
 */
function getXAxisData(datas) {
	var indicatorArray = new Array(datas.length);
	for (var i = 0; i < indicatorArray.length; i++) {
		indicatorArray[i] = datas[i][0];
		datas[i].splice(0, 1);
	}
	return indicatorArray;
}
/**
 * 获取数据封装参数
 * @param {Object} analyzeItems 分析项目 字符串数组 如分析北京 上海 广州 的农业林业牧业副业渔业 ['北京','上海','广州']
 * @param {Object} datas对应行业的参数的二维数组,注意父数组长度对应对比分类 子数组长度应与分析项目长度相同,对应相应的对比项目下的分类的参数 如[[10,20,50],[30,80,100],[500,600,200],[700,800,900],[100,200,300]]
 */
function getSeriesData(analyzeItems, datas, pictrueType) {
	var seriesData = new Array(analyzeItems.length);
	for (var i = 0; i < analyzeItems.length; i++) {
		var dataItem = new Object();
		dataItem.data = getAnalyzeItem(i, datas);
		dataItem.name = analyzeItems[i];
		dataItem.type = pictrueType;
		dataItem.smooth = true;
		/**	dataItem.itemStyle = {normal: {areaStyle: {type: 'default'}}};*/
		seriesData[i] = dataItem;
	}
	/*此函数不支持IE8 暂时注释*/
	/**console.log(JSON.stringify(seriesData));*/
	return seriesData;
}
/**
 * 获取指定索引的所有分类数据
 * @param {Object} index 指定的索引
 * @param {Object} datas对应行业的参数的二维数组,注意父数组长度对应对比分类 子数组长度应与分析项目长度相同,对应相应的对比项目下的分类的参数 如[[10,20,50],[30,80,100],[500,600,200],[700,800,900],[100,200,300]]
 */
function getAnalyzeItem(index, datas) {
	var value = new Array(datas.length);
	for (var i = 0; i < value.length; i++) {
		value[i] = datas[i][index];
	}
	return value;
}
function drawPiePicture(drawPictureDiv, title, analyzeItems, datas) {
	/** 基于准备好的dom,初始化echarts图表*/
	myChart = echarts.init(document.getElementById(drawPictureDiv));
	var option = {
		title: {
			text: title,
			x: 'center',
			textStyle:{
				color: '#333',
				fontStyle: 'normal',
				fontWeight: 'normal',
				fontFamily: 'sans-serief',
				fontSize: 25
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			x: 'left',
			data: analyzeItems,
			textStyle:{
				fontStyle: 'normal',
				fontWeight: 'normal',
				fontFamily: 'sans-serief',
				fontSize: 15
			}
		},
		toolbox: {
			show: true,
			feature: {
				mark: {
					show: true
				},
				dataView: {
					show: true,
					readOnly: false
				},
				magicType: {
					show: true,
					type: ['pie', 'funnel'],
					option: {
						funnel: {
							x: '25%',
							width: '50%',
							funnelAlign: 'left',
							max: 1548
						}
					}
				},
				restore: {
					show: true
				},
				saveAsImage: {
					show: true
				}
			}
		},
		calculable: true,
		series: [{
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: datas,
			itemStyle: {
				normal: {
					label: {
						show: true,
						formatter: '{b} : {c}' + '吨标煤' + ' ({d}%)',
						textStyle:{
							fontStyle: 'normal',
							fontWeight: 'normal',
							fontFamily: 'sans-serief',
							fontSize: 15
						}
					},
					labelLine: {
						show: true
					}
				}
			}
		}]
	};
	/** 为echarts对象加载数据 */
	myChart.setOption(option);
}
function drawColummnPicture(echartsTitle, drawPictureDiv, analyzeItems) {
	/** 基于准备好的dom,初始化echarts图表*/
	myChart = echarts.init(document.getElementById(drawPictureDiv));;
	/** 指定图表的配置项和数据*/
	var option = {
		title: {
			text: echartsTitle,
			x: 'center'
		},
		tooltip: {
			trigger: 'axis'
		},
		legend: {
			orient: 'horizontal',
			padding: 3,
			data: analyzeItems,
			x: 'center',
			y: 'bottom'
		},
		xAxis: [{
			type: 'category',
			data: ['系统效率']
		}],
		yAxis: [{
			type: 'value'
		}],
		series: [{
			name: '',
			type: 'bar',
			data: []
		}]
	};
	/** 为echarts对象加载数据 */
	myChart.setOption(option);
}
function drawColummnMap(title,
						analyzeItems,
						datas, 
						drawPictureDiv,
						yTitle) {
	var myChart = echarts.init(document.getElementById(drawPictureDiv));

	option = {
		title: {
			text: title,
			x: 'center'
		},
		tooltip: {
			trigger: 'axis'
		},
		legend: {
			orient: 'horizontal',
			padding: 1,
			data: analyzeItems,
			x: 'center',
			y: 'bottom',
			itemWidth: 10,             /** 图例图形宽度*/
        	itemHeight: 5,  		   /** 图例图形高度*/
        	textStyle: {
            	fontSize:7                /** 图例文字大小*/
        	}
		},
		toolbox: {
			show: true,
			feature: {
				mark: {
					show: true
				},
				dataView: {
					show: false,
					readOnly: false
				},
				magicType: {
					show: true,
					type: ['line', 'bar', 'stack', 'tiled']
				},
				restore: {
					show: false
				},
				saveAsImage: {
					show: true
				}
			}
		},
		calculable: true, /**启用拖拽重计算特性*/
		xAxis: [{
			type: 'category',
			data: getXAxisDataOne(datas)
		}],
		yAxis: [{
			type: 'value',
			name:yTitle
		}],
		series: getSeriesDataOne(analyzeItems, datas)
	};
	myChart.setOption(option);
}
			function getXAxisDataOne(pictrueDatas) {
				var indicatorArray = new Array(pictrueDatas.length);
				for (var i = 0; i < indicatorArray.length; i++) {
					indicatorArray[i] = pictrueDatas[i][0];
					pictrueDatas[i].splice(0, 1);
				}
				return indicatorArray;
			}
			function getSeriesDataOne(testAnalyzeItems, pictrueDatas) {
				var seriesData = new Array(testAnalyzeItems.length);
				for (var i = 0; i < testAnalyzeItems.length; i++) {
					var dataItem = new Object();
					dataItem.data = getAnalyzeItem(i, pictrueDatas);
					dataItem.name = testAnalyzeItems[i];
					dataItem.type = 'bar';
					dataItem.smooth = true;
					seriesData[i] = dataItem;
				}
				return seriesData;
			}
			function testAnalyzeItems(index, pictrueDatas) {
				var value = new Array(pictrueDatas.length);
				for (var i = 0; i < value.length; i++) {
					value[i] = datas[i][index];
				}
				return value;
			}

alertWin 早期作品

    /**
     * @author 作者:张建新
     *弹窗封装类 alertWin(title, msg, w, h)
     * 示例写法:alertWin('提示信息','数据库修改失败',200,200);
     * @param {Object} title 标题
     * @param {Object} msg 错误信息以及提示信息
     * @param {Object} w 宽度
     * @param {Object} h 高度
     **/
    function alertWin(title, msg, w, h) {
        var titleheight = "22px"; /** 提示窗口标题高度 */
        var bordercolor = "#364751"; /** 提示窗口的边框颜色 */
        var titlecolor = "#FFFFFF"; /** 提示窗口的标题颜色 */
        var titlebgcolor = "#364751"; /** 提示窗口的标题背景色 */
        var bgcolor = "#FFFFFF"; /** 提示内容的背景色 */
    
        var iWidth = document.documentElement.clientWidth;
        var iHeight = document.documentElement.clientHeight;
        var bgObj = document.createElement("div");
        bgObj.style.cssText = "position:absolute;left:0px;top:0px;width:" + iWidth + "px;height:" + Math.max(document.body.clientHeight, iHeight) + "px;filter:Alpha(Opacity=30);opacity:0.3;background-color:#000000;z-index:101;";
        document.body.appendChild(bgObj);
    
        var msgObj = document.createElement("div");
        msgObj.style.cssText = "position:absolute;font:11px '宋体';top:" + (iHeight - h) / 2 + "px;left:" + (iWidth - w) / 2 + "px;width:" + w + "px;height:" + h + "px;text-align:center;border:1px solid " + bordercolor + ";background-color:" + bgcolor + ";line-height:22px;z-index:102;";
        document.body.appendChild(msgObj);
    
        var table = document.createElement("table"); /** */
        msgObj.appendChild(table);
        table.style.cssText = "margin:0px;border:0px;padding:0px;";
        table.cellSpacing = 0;
        var tr = table.insertRow(-1);
        var titleBar = tr.insertCell(-1);
        titleBar.style.cssText = "width:100%;height:" + titleheight + "px;text-align:left;padding:3px;margin:0px;font:bold 13px '宋体';color:" + titlecolor + ";border:1px solid " + bordercolor + ";cursor:move;background-color:" + titlebgcolor;
        titleBar.style.paddingLeft = "10px";
        titleBar.innerHTML = title;
        var moveX = 0;
        var moveY = 0;
        var moveTop = 0;
        var moveLeft = 0;
        var moveable = false;
        var docMouseMoveEvent = document.onmousemove; 
        var docMouseUpEvent = document.onmouseup;
        titleBar.onmousedown = function() {
            var evt = getEvent();
            moveable = true;
            moveX = evt.clientX;
            moveY = evt.clientY;
            moveTop = parseInt(msgObj.style.top);
            moveLeft = parseInt(msgObj.style.left);
    
            document.onmousemove = function() {
                if (moveable) {
                    var evt = getEvent();
                    var x = moveLeft + evt.clientX - moveX; /***/
                    var y = moveTop + evt.clientY - moveY;
                    if (x > 0 && (x + w < iWidth) && y > 0 && (y + h < iHeight)) {
                        msgObj.style.left = x + "px";
                        msgObj.style.top = y + "px";
                    }
                }
            };
            document.onmouseup = function() {
                if (moveable) {
                    document.onmousemove = docMouseMoveEvent; /** */
                    document.onmouseup = docMouseUpEvent;
                    moveable = false;
                    moveX = 0;
                    moveY = 0;
                    moveTop = 0;
                    moveLeft = 0;
                }
            };
        }
    
        var closeBtn = tr.insertCell(-1);
        closeBtn.style.cssText = "cursor:pointer; padding:2px;background-color:" + titlebgcolor;
        closeBtn.innerHTML = "<span style='font-size:15pt; color:" + titlecolor + ";'>×</span>";
        closeBtn.onclick = function() {
            document.body.removeChild(bgObj);
            document.body.removeChild(msgObj);
        }
        var msgBox = table.insertRow(-1).insertCell(-1);
        msgBox.style.cssText = "font:10pt '宋体';";
        msgBox.colSpan = 2;
        msgBox.innerHTML = msg;
        /**
        获得事件Event对象,用于兼容IE和FireFox 
        * 为了兼容 Ie 进行获取ie 浏览器窗口的操作控制
        */
        function getEvent() {
            return window.event || arguments.callee.caller.arguments[0];
        }
    }

Affiliate

Search

    Post Directory