一个考试系统的部分代码,功能是异步提交答案!
曾经遇到的问题: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; //返回提示信息
}
}
}
分享到:
相关推荐
### AJAX异步通信技术详解 #### 一、引言 AJAX(Asynchronous JavaScript and XML)是一种使用JavaScript和XML在浏览器与服务器之间进行数据传输的技术。通过这种技术,可以实现网页部分更新,而无需重新加载整个...
GET用于获取数据,POST用于提交数据,PUT用于更新已有资源,DELETE用于删除资源。 **四、数据格式** 虽然名字中有XML,但实际使用中,Ajax传输的数据格式并不局限于XML,还可以是JSON、HTML、Text等。JSON由于其轻...
### AJAX异步交互详解 #### 一、概念与特点 **AJAX**(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换来实现这一功能,...
5. 应用实例:通过AJAX实现动态加载数据,无刷新表单提交,实时更新内容等。 6. 性能优化:使用HTTP缓存,减少HTTP请求,优化JSON数据结构等。 通过对这些知识点的深入学习,开发者可以创建更加高效、交互性强的Web...
### Ajax与JQuery达内培训笔记精要 #### Ajax概览 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现...
- **表单验证**:在用户提交数据前,使用AJAX验证输入的有效性,避免不必要的跳转。 - **分页加载**:在滚动页面时,使用AJAX动态加载更多内容,提升用户体验。 - **实时更新**:例如聊天应用中,使用AJAX实现实时的...
- 异步是指Ajax请求不会阻塞浏览器执行其他任务,用户可以继续浏览页面或执行其他操作,提高了交互性。 3. **用户界面优化**: - 在用户名输入框中应用Ajax,当用户输入时,后台会检查用户名是否已被注册,通过...
### Ajax和jQuery学习笔记 #### 一、Ajax基础与原理 **1.1 什么是Ajax?** Ajax(Asynchronous JavaScript and XML,异步JavaScript和XML)是一种用来创建快速动态网页的技术,通过在后台与服务器进行少量数据...
Ajax(Asynchronous JavaScript and XML),即异步JavaScript与XML,是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新,这意味着可以在不重新加载整个网页的情况...
而Ajax通过异步通信,允许页面其他部分的正常加载和显示,只有在收到服务器响应后,才更新特定的页面区域,避免了用户界面的卡顿,提高了交互速度。 ### Ajax的实现方法 #### 1. JavaScript中的Ajax异步调用 在...
jQuery的`$.ajax()`是进行异步请求的核心函数,支持GET、POST等多种HTTP方法。`$.getJSON()`、`$.getScript()`等简化了特定类型的Ajax请求。`$.ajaxComplete()`等事件处理器则用于监听Ajax请求的状态。 六、插件与...
### Ajax学习笔记个人总结 #### 一、XMLHttpRequest对象简介 **XMLHttpRequest** 对象是 AJAX 技术的核心,它负责在客户端与服务器之间发送异步请求,无需刷新整个页面即可实现局部数据更新。要使用 ...
- **打开连接**:使用XMLHttpRequest对象的`open()`方法,指定请求类型(GET或POST)、URL和是否异步。 - **发送请求**:调用`send()`方法,可以传递数据到服务器。 - **接收响应**:监听`onreadystatechange`...
- 发送请求:通过XMLHttpRequest对象的open()方法设置请求类型(GET或POST)、URL和是否异步,然后用send()方法发送请求。 - 处理响应:当服务器返回响应时,XMLHttpRequest对象的onreadystatechange事件会被触发,...
Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这项技术自2005年被广泛使用以来,极大地提升了网页应用的用户体验,因为它...
在前后端分离的开发模式下,Ajax扮演着重要角色,它使得前端可以直接与API接口交互,获取或提交数据,实现动态内容加载。 ### 10. 跨域问题 由于同源策略限制,Ajax请求通常只能访问同一域名下的资源。跨域请求...
### AJAX学习笔记 #### 一、引言 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。...
在本篇Java相关课程系列笔记之十一中,我们聚焦于Ajax的学习,这是一项在Web开发中广泛使用的技术,用于创建动态、无刷新的用户界面。Ajax全称Asynchronous JavaScript and XML,即异步JavaScript和XML,它允许网页...
**Ajax 源码笔记** Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这种技术的核心在于利用JavaScript与服务器进行异步数据交换,从而提升用户体验,使得...
在本篇16ajax学习笔记1中,我们将探讨Ajax的基础概念、使用方法以及jQuery库中的Ajax实现。 1、发送请求: Ajax的首要任务是创建XMLHttpRequest对象,这是浏览器提供的API。在JavaScript中,我们可以通过new ...