`
Franciswmf
  • 浏览: 780349 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

运用Ajax的xmlHttpRequest对象异步与后台交互并提示交互结果

 
阅读更多
---------------body
<td width="80%" height="26" valign="bottom" class="font13">
<div align="right">
<a href="javaScript:saveMissiveNo();" target="_self">保存</a>
&nbsp;|&nbsp;
<a href="<%=path%>/pages/missiveManage/MissiveNoManager.jsp"
						target="_parent">返回</a>
</div>
</td>
-------------action/session
						// response.setContentType("text/xml;charset=utf-8");
						   PrintWriter out=null;
						   try {
							out = response.getWriter();
						   } catch (IOException e1) {
						 	e1.printStackTrace();
						   }
						   try{
						    String userName=request.getParameter("userName");
						    if ("ss".equals(userName)) {
								out.print("是");
							} else {
								out.print("否");
							}
						   }catch(Exception e){
						    e.printStackTrace();
						   }
-------------js
function saveMissiveNo(){
var isTrue = true;
var flag=0;
var isDepartment=1;//所属类型:部门
var isYes=1;//是否:是新公文类型
var typeScope=document.getElementById("typeScope").value;//公司:不提示选择部门
var orgname=document.getElementById("orgname").value;
var orgid=document.getElementById("orgid").value;
var describe=document.getElementById("describe").value;
var dealType=document.getElementById("dealType").value;
var year=document.getElementById("year").value;
var arr="";//数组无法直接传,用传递字符串的方法
if(typeScope==0){isDepartment=0;}
if(document.getElementById("dept").style.display=="block"){
if(document.getElementById("old").checked){ isYes=0;}
}
//js非空判断
if (typeScope == -1) {
    alert( "请选择所属类型!" );
    document.forms[0].typeScope.focus();
   isTrue=false; 
   return; 
}
if(document.getElementById("good").style.display=="block"){
if(document.getElementById("pop").value==1){
var es=document.getElementsByName("missiveType");
if(es.length>0) {
 for (i = 0; i < es.length; i++) {
		if (es[i].checked==true) {
			flag=1;
			break;
		} else {
			flag=0; 
		}
	}
		if(flag==0){
		alert('请至少选择一个公文类别');
		document.forms[0].mm.focus();
		isTrue=false;
		return;
		}
  }
for (i = 0; i < es.length; i++) {
if(es[i].checked){
arr=arr+es[i].value+",";
}
}
}
}
if(document.getElementById("good").style.display=="block"&&document.getElementById("pop").value==-1){
 alert("公文类别无数据,无法保存");
 isTrue=false; 
 return;
 }
if(document.getElementById("div").style.display=="block"&&document.forms[0].orgname.value==""&&typeScope!="0"){
    alert('请选择部门');
    document.forms[0].orgname.focus();
   isTrue=false; 
   return;
  }
if(document.getElementById("news").checked==true||document.getElementById("comp").style.display=="block"){
if(document.getElementById("pop").value==1&&document.getElementById("div5").style.display=="block"){
if(document.getElementById("describe").value == ""||document.getElementById("describe").value ==null){
		alert('固定描述不能为空');
		document.forms[0].describe.focus();
		isTrue=false;
		return; 
		}
}
}
if(document.getElementById("news").checked==true||document.getElementById("comp").style.display=="block"){
if(document.getElementById("pop").value==1&&document.getElementById("div3").style.display=="block"){
if(document.getElementById("dealType").value == ""||document.getElementById("dealType").value ==null){
		alert('请选择处理类型');
		document.forms[0].dealType.focus();
		isTrue=false;
		return; 
		}
}
}
if(isTrue){
 saveMissiveNoAjax(isDepartment,orgname,orgid,isYes,arr,dealType,year,describe);
 //新增成功之后重新返回addMissiveNo.jsp页面
}
}
var xmlHttp;//放在外面,照顾回调函数
function createXDOM(){//创建xmlhttprequest
 try
    {
    xmlHttp=new XMLHttpRequest();
    }
 catch (e)
    {
   try
      {
     xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
   catch (e)
      {

      try
         {
         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
      catch (e)
         {
         alert("您的浏览器不支持XMLHTTP对象!");
         return false;
         }
      }
    }
}

function saveMissiveNoAjax(x,y,z,o,p,q,r,s){
var userName=document.getElementById("userName").value;
var url="<%=path%>/pages/MissiveNoManager/index.do?doaction=saveMissiveNo&isDepartment="+x+"&orgname="+y+"&orgid="+z+"&isYes="+o+"&arr="+p+"&dealType="+q+"&year="+r+"&describe="+s+"&userName="+userName;
createXDOM();
if (xmlHttp){//成功创建xmlhttprequest
   xmlHttp.onreadystatechange=callBack;
   xmlHttp.open("POST",url,true);//与服务端建立连接(请求方式post或get,地址,true表示异步)
   xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//传递数据的方法同样有GET和POST两种,但是当方法为POST时下面的一句话就必须写
   xmlHttp.send(null);//发送请求
  } 
}
function callBack(){//回调函数
if(xmlHttp.readyState==4){//请求状态为4表示成功
    if(xmlHttp.status==200){//http状态200表示OK
   if(xmlHttp.responseText=='Y'){alert("保存成功!");
    document.forms[0].submit();
   }
   else {alert("保存失败!");
   document.forms[0].submit();
   }
    }
    else{//http返回状态失败
    alert("服务端返回状态" + xmlHttp.statusText);
    }
}
else{//请求状态还没有成功,页面等待
    document.getElementById("resultMess").innerHTML="数据加载中……";
}
}


分享到:
评论

相关推荐

    Ajax简单的异步交互及Ajax原生编写

    首先我们创建ajax的核心对象,由于浏览器的兼容问题我们在创建ajax核心对象的时候不得考虑其兼容问题,因为要想实现异步交互的后面步骤都基于第一步是否成功的创建了ajax核心对象. function getXhr(){ // 声明...

    XMLHttpRequest对象_Ajax异步请求重点(推荐)

    1.Ajax能够是实现异步传输,所依赖的就是JavaScript中的XMLHttpRequest 2.XMLHttpRequest对象是XMLHttp组件的对象,它是一个抽象对象,允许脚本从服务器获取返回的eXML数据或将数据发送到服务器端 3.XMLHttpRequest...

    Ajax+js实现异步交互

    首先我们创建ajax的核心对象,由于浏览器的兼容问题我们在创建ajax核心对象的时候不得考虑其兼容问题,因为要想实现异步交互的后面步骤都基于第一步是否成功的创建了ajax核心对象. function getXhr(){ // 声明...

    AJAX XMLHttpRequest对象详解

    AJAX是一种创建交互式网页应用的网页开发技术,是异步Javascript和XML的集合。其核心是XMLHttpRequest对象,可以在不向服务器端提交整个页面的情况下,实现局部更新网页,它是AJAX的Web应用程序架构的一项关键技术。...

    《Ajax技术简介和案例分析》(42P)

    使用XMLHttpRequest进行异步数据传输 使用JavaScript将所有这些绑在一起 XMLHttpRequest 1999年IE5.0作为一个ActiveX对象形式引入了XMLHttpRequest对象 目的是实现通过后台获取数据 其他浏览器则把它作为window...

    全面剖析XMLHttpRequest对象

    异步JavaScript与XML(AJAX)是一个专用术语,用于实现在客户端脚本与服务器之间的数据交互过程。这一技术的优点在于,它向开发者提供了一种从Web服务器检索数据而不必把用户当前正在观察的页面回馈给服务器。与现代...

    PHP100视频教程 48:Ajax+PHP快速上手及应用

    2、创建XMLHttpRequest对象对于Ajax,最核心的一个对象是XMLHttpRequest,所有的Ajax操作都离不开对这个对象的操作xmlHttp = new XMLHttpRequest();3、XMLHttpRequest对象相关方法XMLHttpRequest.open(传递方式,地址...

    用AJAX实现页面登陆以及注册用户名验证的简单实例

    AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互...通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某

    Ajax笔记.docx

    Ajax 通过在后台与服务器进行少量数据交换,而无需重新加载整个网页,就能使网页实现异步更新。这种技术基于标准的 Web 技术,包括 HTML、CSS、JavaScript、DOM 和 XML。 Ajax 的核心是 XMLHttpRequest 对象,它...

    Ajax核心XMLHttpRequest总结

    Ajax:即”Asynchronous JavaScript and XML”(异步JavaScript和XML),一门综合性的技术:运用JavaScript对象XMLHttpRequest进行异步数据交换;JavaScript操作DOM实现动态效果;运用XHTML+CSS表达信息;XML和XSLT...

    PHP100视频教程 48:Ajax PHP快速上手及应用.rar

    对于Ajax,最核心的一个对象是XMLHttpRequest,所有的Ajax操作都离不开对这个对象的操作 xmlHttp = new XMLHttpRequest(); 3、XMLHttpRequest对象相关方法 XMLHttpRequest.open(传递方式,地址,是否异步请求) ...

    关于ajax的论文

    其实,AJAX(Asynchronous JavaScript and XML)是多种技术的综合,它使用XHTML和CSS标准化呈现,使用DOM实现动态显示和交互,使用XML和XSTL进行数据交换与处理,使用XMLHttpRequest对象进行异步数据读取,使用...

    ajax文档ajax文档

    AJAX 指异步 JavaScript 及 XML(Asynchronous JavaScript And XML)。  国 [使用ajax 构建应用程序] 使用ajax 构建应用程序 内翻译常为“阿贾克斯”和阿贾克斯足球队同音。Web应用的交互如Flickr,Backpack和...

    ajax客户端XMLHttpRequest 实例

    这里我们用客户端通过XMLHttpRequest 请求服务端获取当前系统时间,实现异步交互!

    Ajax异步请求响应.java

    XMLHttpRequest的方法与属性: 方法: open与send open(method,url, asynch) :建立对服务器的调用 (method 表示请求方式, url 请求路径, asynch 是否异步,对于 asynch 的值通常不会设置, 默认是true,表示异步...

    JavaScript中完整的Ajax异步请求的理解和使用

    Ajax异步请求的理解和使用1. Ajax 异步请求 说明2. Ajax 实现对象:XMLHttpRequest2.1 xhr 建立...通过在后台与服务器进行少量数据交换,AJAX可以是网页实现异步更新。 这意味着可以在不重新加载整个网页的情况下,对网

    PHP培训教程之AJAX技术.docx

    使用AJAX技术,就可以使Javascript通过XMLHttpRequest对象直接与器进行交互。 PHP培训教程之AJAX技术全文共3页,当前为第1页。 通过HTTPRequest,一个web页面可以一个请求到web器并且接受web器返回的信息(不用重新...

    Java异步请求

    2、异步交互模型,客户端将请求提交给Ajax引擎,客户端可以继续操作,由Ajax引擎来完成与服务武器端通信,当响应回来后,Ajax引擎会更新客户页面,在客户端提交请求后,用户可以继续操作,而无需等待 。

    AJAX基础教程及实例

    通过AJAX,您的JavaScript可使用JavaScript的XMLHttpRequest对象来直接与服务器进行通信。通过这个对象,您的JavaScript可在不重载页面的情况与Web服务器交换数据。AJAX在浏览器与Web服务器之间使用异步数据传输...

    ASP.NET AJAX 省市县三级联动 带sql 完整数据库

    AJAX省市县三级联动之XMLHttpRequest XMLHttpRequest.html AJAX(Asynchronous JavaScript And XML,异步...AJAX的核心就是集成于JavaScript中的XMLHttpRequest对象,他能通过异步的方式与服务器间进行数据交互

Global site tag (gtag.js) - Google Analytics