码迷,mamicode.com
首页 > Web开发 > 详细

ajax

时间:2017-06-13 00:11:53      阅读:324      评论:0      收藏:0      [点我收藏+]

标签:tca   keycode   encode   rand   clientx   clear   end   事件委托   监听   

//将数据转换成 a=1&b=2格式;
function json2url(json){
//加随机数防止缓存;
json.t = Math.random();
 
var arr = [];
for(var name in json){
arr.push(name+‘=‘+json[name]);
}
return arr.join(‘&‘);
}
 
 
function ajax(json){
//1.创建一个ajax对象;
if(window.XMLHttpRequest){
var oAjax = new XMLHttpRequest();
}else{
var oAjax = new ActiveXObject(‘Microsoft.XMLHTTP‘);
}
 
 
//考虑默认值:
if(!json.url){
alert(‘请输入合理的请求地址!‘);
return;
}
json.type = json.type || ‘get‘;
json.time = json.time || 3000;
json.data = json.data || {};
 
 
 
//判断用户传递的是get还是post请求:
switch (json.type.toLowerCase()){
case ‘get‘:
//2.打开请求;
oAjax.open(‘get‘,json.url+‘?‘+json2url(json.data),true);
//3.发送数据:
oAjax.send();
break;
 
case ‘post‘:
//打开请求;
oAjax.open(‘post‘,json.url,true);
//设置请求头;
oAjax.setRequestHeader(‘Content-type‘,‘application/x-www-form-urlencoded‘);
//发送数据;
oAjax.send(json2url(json.data));
 
}
 
 
//4.获取响应数据
oAjax.onreadystatechange = function() {
if (oAjax.readyState == 4) {
if (oAjax.status >= 200 && oAjax.status < 300 || oAjax.status == 304) {
//如果外边传递了成功的回调函数,那么就执行,
json.success && json.success(oAjax.responseText);
} else {
//如果外边传递了失败的回调函数,那么就执行,
json.error && json.error(oAjax.status);
}
clearTimeout(timer);//规定时间内取到数据后清除定时器;
}
};
 
 
//设置网络响应超时;
var timer;
timer = setTimeout(function(){
alert(‘网络响应超时,请稍后再试‘);
oAjax.onreadystatechange = null;//网络超时后清除事件;
},json.time);
 
 
}
 
 
2.
清除缓存:加随机数
缓冲:浏览器针对同一个网址只会访问一次
 
 
3.在使用ajax的时候注意
1.文件编码格式保持一致;
2.从后台取过来的数据都是string(字符串);
3.缓冲;
 
eval:就是把字符串解析成js可以执行的任何代码;
 
ajax:不允许跨域获取数据;
 
jsonp:跨域获取数据;
两个不同的空间
www.123.com
www.456.com
 
 
 
onkeydown:键盘按下
 
onkeyup:键盘抬起
 
script标签是一次性的;src属性需要加载执行;
 
 
event: 存储或这描述了事件更加详细的信息;
event.clientX;
event.clientY;
event.keyCode
event.cancelBubble = true;
 
 
 
事件捕获:obj.setCapture();
把多有的经历放到某一个事件上,点击页面上任何地方都相当于在点击这个按钮;
 
 
释放捕获:
obj.releaseCapture();
 
 
事件绑定【监听】:
obj.addEventLister(事件名,函数名,false);
obj.attachEvent(事件名,函数名);事件名必须加on;
同一个元素、同一个事件,需要执行不同的方法;
 
 
删除事件绑定:
obj.removeEventListener(事件名,函数名,false);
obj.removeEvent(on+"函数名",函数名);
 
 
事件委托:
把子元素的事件交给父元素来做;

ajax

标签:tca   keycode   encode   rand   clientx   clear   end   事件委托   监听   

原文地址:http://www.cnblogs.com/zy17600095897/p/6995342.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!