不刷新页面更新网页

在页面加载后从服务器请求数据

在页面加载后从服务器接收数据

在后台向服务器发送数据

下面是用js实现的ajax

//ajax

//创建一个XmlHttpRequest对象

var xmlHttpReq;

function createXmlHttpRequest()

{

    if(window.XMLHttpRequest)

    {//非IE

      xmlHttpReq = new XMLHttpRequest();

    }else

    { //IE

      xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");

    }

}

//删除学生信息

function dropValues(){

//获取多选框的值

    obj = document.getElementsByName("studentInfo");

    createXmlHttpRequest();

    for(k in obj){

        if(obj[k].checked){

        //尝试以异步的get方式访问dropServlet

        var stuName = obj[k].value;

    alert("确认删除："+ stuName +"?");

    //path

    var url = "webDemo4/drop?oper=drop&sname="+stuName;

    //向服务器发送请求

    xmlHttpReq.open("get",url,true);

    //回调函数

    xmlHttpReq.onreadystatechange = processResponse;

        xmlHttpReq.send(null);

        }

    }

}

//增加学生信息

function addValues(){

    var name = $("#stuName").val();

    var sex = $("#stuSex").val();

    var age = $("#stuAge").val();

    var addr = $("#stuAddr").val();

    createXmlHttpRequest();

    alert("增加学生信息:"+name);

    //尝试以异步的get方式访问dropServlet

    var url = "webDemo4/drop?oper=add&sname="+name+"&"+"ssex="+sex+"&"+"sage="

    +age+"&"+"saddress="+addr;

    //向服务器发送请求

    xmlHttpReq.open("get",url,true);

  //指定响应函数

    xmlHttpReq.onreadystatechange = processResponse;

    xmlHttpReq.send(null);

}

//响应函数

function processResponse() { 

if (xmlHttpReq.readyState == 4) { // 判断对象状态 

            if (xmlHttpReq.status == 200) { // 信息已经成功返回，开始处理信息 

                alert("刷新成功！");

                $("#show").html(xmlHttpReq.responseText);

            } else { //页面不正常 

                window.alert("您所请求的页面有异常。"); 

            } 

        } 

      } 

//修改学生信息

function modifyValues(){

  var name = $("#stuName").val();

    var sex = $("#stuSex").val();

    var age = $("#stuAge").val();

    var addr = $("#stuAddr").val();

    createXmlHttpRequest();

    alert("修改学生信息:"+name);

    //尝试以异步的get方式访问dropServlet

    var url = "webDemo4/drop?oper=modify&sname="+name+"&"+"ssex="+sex+"&"+"sage="

    +age+"&"+"saddress="+addr;

    //向服务器发送请求

    xmlHttpReq.open("get",url,true);

  //指定响应函数

    xmlHttpReq.onreadystatechange = processResponse;

    xmlHttpReq.send(null);

}

//首次刷新

function fresh(){

createXmlHttpRequest();

var url = "webDemo4/drop?oper=query";

//向服务器发送请求

xmlHttpReq.open("get",url,true);

//指定响应函数

    xmlHttpReq.onreadystatechange = processResponse;

    xmlHttpReq.send(null);

}

fresh();