jquery ajax實現代碼



function createXHR() {
	if (typeof XMLHttpRequest != 'undefined') {
		return new XMLHttpRequest();
	} else if (typeof ActiveXObject != 'undefined') {
		var version = [
									'MSXML2.XMLHttp.6.0',
									'MSXML2.XMLHttp.3.0',
									'MSXML2.XMLHttp'
		];
		for (var i = 0; version.length; i ++) {
			try {
				return new ActiveXObject(version[i]);
			} catch (e) {
				//跳過
			}	
		}
	} else {
		throw new Error('您的系統或瀏覽器不支持XHR對象!');
	}
}


/*
//POST請求
addEvent(document, 'click', function () {
	var xhr = createXHR();		
	var url = 'demo.php?rand=' + Math.random();
	xhr.onreadystatechange = function () {
		if (xhr.readyState == 4) {
			if (xhr.status == 200) {
				alert(xhr.responseText);
			} else {
				alert('獲取數據錯誤!錯誤代號:' + xhr.status + ',錯誤信息:' + xhr.statusText);
			}	
		}
	};
	xhr.open('post', url, true);							//第一步改爲post
	xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');		//第三步,模擬表單提交
	xhr.send('name=Lee&age=100');			//第二步將名值對放入send方法裏
});
*/


//名值對轉換爲字符串
function params(data) {
	var arr = [];
	for (var i in data) {
		arr.push(encodeURIComponent(i) + '=' + encodeURIComponent(data[i]));
	}
	return arr.join('&');
}


//封裝ajax
function ajax(obj) {
	var xhr = createXHR();
	obj.url = obj.url + '?rand=' + Math.random();
	obj.data = params(obj.data);
	if (obj.method === 'get') obj.url += obj.url.indexOf('?') == -1 ? '?' + obj.data : '&' + obj.data;
	if (obj.async === true) {
		xhr.onreadystatechange = function () {
			if (xhr.readyState == 4) {
				callback();
			}
		};
	}
	xhr.open(obj.method, obj.url, obj.async);
	if (obj.method === 'post') {
		xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		xhr.send(obj.data);	
	} else {
		xhr.send(null);
	}
	if (obj.async === false) {
		callback();
	}
	function callback() {
		if (xhr.status == 200) {
			obj.success(xhr.responseText);			//回調傳遞參數
		} else {
			alert('獲取數據錯誤!錯誤代號:' + xhr.status + ',錯誤信息:' + xhr.statusText);
		}	
	}
}


//調用ajax
addEvent(document, 'click', function () {
	ajax({
		method : 'post',
		url : 'demo3.php',
		data : {
			'name' : 'Lee',
			'age' : 100
		},
		success : function (text) {
			alert(text);
		},
		async : true
	});
});



/*
//作用域,無法返回
function a() {
	function b() {
		return 123;
	}
	return 456;
}

alert(a());
*/




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章