ajax简单框架

xiaoxiao2026-08-09  8

//放在ajax.jsp中

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%><html>  <head>    <title>ajax</title>  </head><script type="text/javascript">var http_request = false;//此函数为框架函数,method为发送方式。url未处理页面。content为发送内容。responseType为处理类型。callback为处理函数。function send_request(method,url,content,responseType,callback) {  http_request = false;  //初始化http_request,使其适应各种浏览器  if(window.XMLHttpRequest) {     http_request = new XMLHttpRequest();    if (http_request.overrideMimeType) {     http_request.overrideMimeType("text/xml");    }  }  else if (window.ActiveXObject) {     try {      http_request = new ActiveXObject("Msxml2.XMLHTTP");    }     catch (e) {      try {        http_request = new ActiveXObject("Microsoft.XMLHTTP");      }       catch (e) {}    }  }  if (!http_request) {     window.alert("不能创建XMLHttpRequest 对象实例");    return false;  }    //根据返回类型,选择处理函数  if(responseType.toLowerCase()=="text") {    http_request.onreadystatechange = function (){    if (http_request.readyState == 4) { // 判断对象状态       if (http_request.status == 200) { //           callback(http_request.responseText);           }        else { //页面不正常           alert(" 请求的页面有异常");       }    }  }  }  else if(responseType.toLowerCase()=="xml") {    http_request.onreadystatechange = function (){    if (http_request.readyState == 4) { // 判断对象状态       if (http_request.status == 200) { //           callback(http_request.responseText);           }        else { //页面不正常           alert(" 请求的页面有异常");       }    }  }          }     else {      window.alert("响应类别参数错误");      return false;    }   //确定发送请求方式和URL以及是否异步执行下列代码   if(method.toLowerCase()=="get") {    http_request.open(method, url, true);//true表示异步执行  }  else if(method.toLowerCase()=="post") {    http_request.open(method, url, true);    http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  }  else {    window.alert("http请求类别参数错误");    return false;  }   //如果为post,会发送content内容。如果为get,这会发送null  http_request.send(content);}//此函数为点击button触动的函数,通过调用框架函数完成功能。function send(){   var name=document.getElementById("name").value;   send_request('POST','index.jsp','name='+name,'text',handler);

//  send_request('GET','index.jsp',null,'text',handler);

}//此函数为处理函数function handler(o){    window.alert(o);}  </script>  <body>    <input type="text" id="name" name="name"/>    <input type="button" value="提交" οnclick="send()"/>    <br/>    <div id="show" name="show"></div>  </body></html>

//放在index.jsp中

<html>

<head>

<title></title>

</head>

<body>

<%

    out.println("姓名为:"+request.getParameter("name"));

%>

</body>

</html>

蓝色部分为 ajax 框架部分,红色部分为框架的使用,例子是 post 方法。

转载请注明原文地址: https://www.6miu.com/read-5050920.html

最新回复(0)