zoukankan      html  css  js  c++  java
  • Ajax

    一、Ajax
    1.异步请求技术
    2.使用场景:
    1、局部刷新、无需刷新整个页面
    2、主动请求数据、ajax只能得到数据、不能进 
    行转发或重定向
    3.使用ajax技术的环境
    ajax技术是由浏览器ajax引擎XMLHttpRequest对象发 
    起的异步请求。
    4.ajax使用步骤
    1.创建ajax引擎
    2.发起请求和提交方式、异步支持
    3.传递数据
    4.回调函数的接受
    5.状态码的判断
    //1.创建XMLHttpRequest对象 ajax引擎
    var xmlHttpRequest = null;
    if(window.XMLHttpRequest){//新版 
    本浏览器
    xmlHttpRequest = new 
    XMLHttpRequest();
    }else{//老版本IE浏览器
    xmlHttpRequest = new 
    ActiveXObject("Microsoft.XMLHTTP");
    }
    //2.发起ajax请求 url method 
    true:异步 false:同步
    xmlHttpRequest.open 
    ("GET","checkName.do?username="+name,true);
    //3.发送数据 
    xmlHttpRequest.send(null);
    //4.回调函数 
    xmlHttpRequest.onreadystatechange 
    = function(){
    //5.成功状态的数据执行 
    4:响应结束 200:请求响应 成功
    if 
    (xmlHttpRequest.readyState == 4

    && xmlHttpRequest.status 
    == 200) {
    var data = 
    xmlHttpRequest.responseText;
    if(data == 
    "true"){

    span.innerHTML = "名字不可用";

    span.style.color = "red";
    }else if(data == 
    "false"){

    span.innerHTML = "名字可用";

    span.style.color = "green";
    }
    }
    }
    二、JQ对Ajax的封装
    1.$.load() 加载页面到指定区域
    2.$.ajax() 底层封装、原始数据参数更多
    $.ajax({
    "url":"checkName.do",//请 
    求的路径
    "type":"GET",//请求的方式

    "data":"username="+username,
    "dataType":"text",//响应 
    回的内容格式
    "async":false,//同步
    "timeout":5000,//等待时间
    "success":function(data){
    });
    3.$.post(url,{data},function(data){},"json")
    4.$.get(url,{data},function(data){},"json")
    5.$.getJSON(url,{data},function(data){})json数据
    6.$.getScript(url,{data});加载并运行js文件

  • 相关阅读:
    【例题 8-11 UVA-10954】Add All
    【例题 8-10 UVA
    【BZOJ1226】学校食堂Dining(状压DP)
    【Tyvj1601】魔兽争霸(主席树,树套树)
    【BZOJ3504】危桥(最大流)
    【BZOJ1812】riv(多叉树转二叉树,树形DP)
    【Vijos1412】多人背包(背包DP)
    【Codevs1907】方格取数3(最小割)
    【Codevs1227】方格取数2(费用流)
    【Tyvj1982】武器分配(费用流)
  • 原文地址:https://www.cnblogs.com/huangbo0502/p/11181114.html
Copyright © 2011-2022 走看看