`
fys124974704
  • 浏览: 137314 次
  • 性别: Icon_minigender_1
  • 来自: 火星
社区版块
存档分类
最新评论

Ajax-Post异步提交(笔记)

阅读更多

一个考试系统的部分代码,功能是异步提交答案!

曾经遇到的问题:1.异步提交,2.IE不支持中文,3.提交的数据量过多丢失,本文已经解决了三个这样的问题

 

var http_request = false;
	var promptid = false;
       function save(examPaperidDetailID,answerid,promptid_,submitButtonFlag,scoreid){
		document.getElementById(promptid_).innerHTML = '保存中......';   //提示
		promptid = promptid_;
		var score = 0;
		if (document.getElementById(scoreid) != null){
			score = document.getElementById(scoreid).value
		}
		var factory = new XMLHttpRequestFactory();
		http_request = factory.getHttpRequest3();
		if (!http_request) {
			alert('建议使用IE或Firefox浏览器!');
		} else {
			var linkurl = "/subsystem/talent/exampaper/SaveAnswerAjax.jsp" 
			var param = "id=" + Math.random()
					+ "&examPaperidDetailID=" + examPaperidDetailID
					+ "&answer=" + escape(document.getElementById(answerid).value)
					+ "&submitButtonFlag="+submitButtonFlag
					+ "&score="+escape(score);
			//alert(param);
                       //将中文 放到  escape('中文') 否则IE提交的时候会丢失数据
                       // "id=" + Math.random() 这样子是为了每次都可以更新一下请求方式
			http_request.open("POST", linkurl, true);  // 利用POST 和 异步

                       // 下面这两句 比较重要,缺少会导致提交的数据为空
			http_request.setRequestHeader("content-length",param.length);  //post提交设置项
    		        http_request.setRequestHeader("content-type","application/x-www-form-urlencoded");  //post提交设置项
			
                       http_request.onreadystatechange = callback;
			http_request.send(param); // 参数在这里传进来 
		}
	}

    function callback() {
      if (http_request.readyState == 4 && http_request.status == 200) { 
      		 if(document.getElementById(promptid) != null){
            	 document.getElementById(promptid).innerHTML = http_request.responseText; //返回提示信息
             }
         } 
    }
 

 

 

分享到:
评论
1 楼 zhiye 2009-03-23  
请问怎么使用呢?
能举个表单上使用的列子吗?
谢谢

相关推荐

    AJAX异步通信技术学习笔记

    ### AJAX异步通信技术详解 #### 一、引言 AJAX(Asynchronous JavaScript and XML)是一种使用JavaScript和XML在浏览器与服务器之间进行数据传输的技术。通过这种技术,可以实现网页部分更新,而无需重新加载整个...

    ajax-day01.rar_达内开发学习笔记

    GET用于获取数据,POST用于提交数据,PUT用于更新已有资源,DELETE用于删除资源。 **四、数据格式** 虽然名字中有XML,但实际使用中,Ajax传输的数据格式并不局限于XML,还可以是JSON、HTML、Text等。JSON由于其轻...

    ajax异步笔记

    ### AJAX异步交互详解 #### 一、概念与特点 **AJAX**(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换来实现这一功能,...

    HTTP-JSON-AJAX-funTimes:学习HTTP,JSON,AJAX和异步JS-学习笔记

    5. 应用实例:通过AJAX实现动态加载数据,无刷新表单提交,实时更新内容等。 6. 性能优化:使用HTTP缓存,减少HTTP请求,优化JSON数据结构等。 通过对这些知识点的深入学习,开发者可以创建更加高效、交互性强的Web...

    Ajax,JQuery达内培训笔记

    ### Ajax与JQuery达内培训笔记精要 #### Ajax概览 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现...

    AJAX笔记

    - **表单验证**:在用户提交数据前,使用AJAX验证输入的有效性,避免不必要的跳转。 - **分页加载**:在滚动页面时,使用AJAX动态加载更多内容,提升用户体验。 - **实时更新**:例如聊天应用中,使用AJAX实现实时的...

    案例_Ajax_用户名异步校验 源代码

    - 异步是指Ajax请求不会阻塞浏览器执行其他任务,用户可以继续浏览页面或执行其他操作,提高了交互性。 3. **用户界面优化**: - 在用户名输入框中应用Ajax,当用户输入时,后台会检查用户名是否已被注册,通过...

    Ajax和jQuery学习笔记

    ### Ajax和jQuery学习笔记 #### 一、Ajax基础与原理 **1.1 什么是Ajax?** Ajax(Asynchronous JavaScript and XML,异步JavaScript和XML)是一种用来创建快速动态网页的技术,通过在后台与服务器进行少量数据...

    Ajax读书笔记

    Ajax(Asynchronous JavaScript and XML),即异步JavaScript与XML,是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新,这意味着可以在不重新加载整个网页的情况...

    Ajax学习笔记---3种Ajax的实现方法【推荐】

    而Ajax通过异步通信,允许页面其他部分的正常加载和显示,只有在收到服务器响应后,才更新特定的页面区域,避免了用户界面的卡顿,提高了交互速度。 ### Ajax的实现方法 #### 1. JavaScript中的Ajax异步调用 在...

    jquerya-Web-master- 开发笔记

    jQuery的`$.ajax()`是进行异步请求的核心函数,支持GET、POST等多种HTTP方法。`$.getJSON()`、`$.getScript()`等简化了特定类型的Ajax请求。`$.ajaxComplete()`等事件处理器则用于监听Ajax请求的状态。 六、插件与...

    Ajax学习笔记个人总结

    ### Ajax学习笔记个人总结 #### 一、XMLHttpRequest对象简介 **XMLHttpRequest** 对象是 AJAX 技术的核心,它负责在客户端与服务器之间发送异步请求,无需刷新整个页面即可实现局部数据更新。要使用 ...

    AJAX应用笔记(1)

    - **打开连接**:使用XMLHttpRequest对象的`open()`方法,指定请求类型(GET或POST)、URL和是否异步。 - **发送请求**:调用`send()`方法,可以传递数据到服务器。 - **接收响应**:监听`onreadystatechange`...

    Ajax从入门到精通(含学习笔记)

    - 发送请求:通过XMLHttpRequest对象的open()方法设置请求类型(GET或POST)、URL和是否异步,然后用send()方法发送请求。 - 处理响应:当服务器返回响应时,XMLHttpRequest对象的onreadystatechange事件会被触发,...

    Ajax 学习笔记,超详细的噢!不看后悔

    Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这项技术自2005年被广泛使用以来,极大地提升了网页应用的用户体验,因为它...

    黑马程序员Ajax笔记

    在前后端分离的开发模式下,Ajax扮演着重要角色,它使得前端可以直接与API接口交互,获取或提交数据,实现动态内容加载。 ### 10. 跨域问题 由于同源策略限制,Ajax请求通常只能访问同一域名下的资源。跨域请求...

    ajax学习笔记

    ### AJAX学习笔记 #### 一、引言 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。...

    Java相关课程系列笔记之十一Ajax学习

    在本篇Java相关课程系列笔记之十一中,我们聚焦于Ajax的学习,这是一项在Web开发中广泛使用的技术,用于创建动态、无刷新的用户界面。Ajax全称Asynchronous JavaScript and XML,即异步JavaScript和XML,它允许网页...

    ajax源码笔记

    **Ajax 源码笔记** Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这种技术的核心在于利用JavaScript与服务器进行异步数据交换,从而提升用户体验,使得...

    16ajax学习笔记1

    在本篇16ajax学习笔记1中,我们将探讨Ajax的基础概念、使用方法以及jQuery库中的Ajax实现。 1、发送请求: Ajax的首要任务是创建XMLHttpRequest对象,这是浏览器提供的API。在JavaScript中,我们可以通过new ...

Global site tag (gtag.js) - Google Analytics