`

Ajax-Post异步提交

    博客分类:
  • ajax
阅读更多
本文代码转载自:http://vincent-feng.iteye.com/blog/342751
	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; //返回提示信息
             }
         } 
    }
分享到:
评论

相关推荐

    jQuery-ajax-用户名异步请求

    这个过程可以通过Ajax调用后台接口实现,避免用户频繁提交表单进行检查。 首先,我们需要在HTML中创建一个输入框和一个按钮,用于获取用户名和触发异步请求: ```html 请输入用户名"> 检查用户名 ``` 然后,我们...

    Ajax-JQuery-Ajax-POST-in-Codeigniter.zip

    Ajax-JQuery-Ajax-POST-in-Codeigniter.zip,如何将带有数据的ajax post请求发送到codeigniter控制器,而不刷新页面并将数据返回到视图。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json...

    jquery-form 异步提交表单

    为了解决这个问题,jQuery Form插件应运而生,它允许我们实现异步(Ajax)表单提交,提高页面的响应性和用户体验。 ### jQuery Form 插件介绍 jQuery Form插件是基于jQuery的一个强大工具,它可以轻松地将任何HTML...

    ajax-req-异步

    - **POST**:提交数据。通常用于提交表单等操作。 3. **onreadystatechange事件**:当`XMLHttpRequest`对象的状态改变时触发此事件。状态值有五个不同的阶段: - **0 (未初始化)**:`request.open()`尚未被调用。...

    异步提交 表格异步提交

    这里我们将详细探讨异步提交的核心概念、工作原理以及如何使用Ajax进行表单异步提交。 ### 1. 异步提交简介 异步提交是基于HTTP的异步通信技术,主要通过JavaScript来实现。它使得前端与后端服务器之间的数据交换...

    Ajax 实现异步提交的几个实例

    本篇文章将详细探讨通过Ajax实现异步提交的几个实例,尤其是自动完成功能。 一、Ajax基础 Ajax的核心是JavaScript对象XMLHttpRequest,它允许在后台与服务器进行数据交换,而不影响用户的界面体验。创建一个Ajax...

    原生ajax代码实现异步提交

    以上就是使用原生Ajax实现异步提交的完整过程。需要注意的是,实际应用中还需要考虑错误处理、兼容性问题(尤其是老版本浏览器)以及安全问题,如防止跨站脚本攻击(XSS)和跨站请求伪造(CSRF)。此外,现代Web开发...

    ajax异步提交表单

    ### AJAX异步提交表单知识点解析 #### 一、AJAX技术概述 AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,AJAX可以...

    ajax异步提交源代码

    本文将深入探讨Ajax异步提交的核心概念,并通过两个示例——一个使用纯JavaScript与Servlet交互,另一个利用Prototype JS框架与Action通信——来阐述其实现过程。 首先,让我们理解Ajax的基本原理。Ajax工作流程...

    Ajax--新手快车道.rar

    1. **表单提交**:Ajax可以无刷新提交表单,避免页面跳转,提升用户体验。 2. **数据加载**:如无限滚动,当用户滚动到底部时,动态加载更多内容。 3. **实时反馈**:比如搜索框的实时提示,输入关键词后立即显示...

    ajax-bridge 以及它在web中的应用

    2. **创建实例**:创建一个Ajax-Bridge的实例,通常会传入一个配置对象,包含URL、请求类型(GET、POST等)和其他选项。 3. **发起请求**:使用实例的方法发起请求,如`send()`,并提供请求参数。 4. **处理响应**:...

    ajax-register.zip_ajax 注册_jsp注册异步

    2. 使用XMLHttpRequest对象的open()方法设置请求类型(GET或POST)、URL(Servlet的路径)和是否异步执行。 3. 发送请求,如果是POST请求,还需使用send()方法传递数据。 4. 监听并处理服务器的响应,通常会有一个...

    ajax异步提交获取信息示例

    **Ajax异步提交获取信息详解** 在Web开发中,AJAX(Asynchronous JavaScript and XML)是一种创建动态网页的技术,允许在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容。本示例主要讲解如何利用...

    WXHHDI01-AJAX-B1-GetStarted-CS

    2. **GET与POST请求**:GET请求通常用于获取资源,而POST请求用于向服务器提交数据。GET请求的数据会显示在URL中,而POST请求则将数据隐藏在请求体中。 3. **创建请求**:使用XMLHttpRequest对象的`open()`方法指定...

    使用jQuery.form插件,实现完美的表单异步提交

    此外,`$.fn.ajaxSubmit`方法还可以接受一个完整的jQuery.ajax选项对象,这意味着你可以使用所有jQuery的Ajax选项,如`cache`、`timeout`、`contentType`等,来定制你的异步请求。 总结一下,jQuery.form插件通过...

    xe-ajax-mock1.5.7.js

    使用xe-ajax-mock,开发者可以设置各种HTTP方法(GET、POST、PUT、DELETE等)的模拟响应,定义返回的HTTP状态码、响应头以及响应体。这样,前端代码在发起请求时,会优先使用这些预设的模拟数据,而不是真正去调用...

    AJAX-技术入门介绍.zip_ajax_异步请求

    当用户触发一个AJAX请求时,JavaScript会创建一个新的XMLHttpRequest对象,然后调用其`open()`方法来指定请求类型(GET或POST)、URL以及是否异步执行。接着,使用`send()`方法发送请求。在请求处理期间,可以监听...

    js-ajax-form-submission-源码.rar

    但通过JavaScript,我们可以捕获这个事件,阻止默认行为,然后使用AJAX进行异步提交。 4. **事件处理程序**:在JavaScript中,我们使用addEventListener()或attachEvent()方法为表单的submit事件添加事件处理程序。...

    foundations-of-ajax-examples案例

    通过学习和实践这些示例,你将能够掌握Ajax的基本用法,如创建XMLHttpRequest对象、发送GET和POST请求、处理服务器响应、以及使用JavaScript操作DOM。此外,还会了解到如何在实际项目中结合Ajax优化Web应用的性能和...

    jquery.unobtrusive-ajax.rar

    这个库利用数据属性(data-* attributes)和jQuery事件来实现Ajax功能,使得页面的异步更新更加优雅和易于维护。 在传统的Web开发中,Ajax通常需要在JavaScript代码中添加大量细节,而jQuery Unobtrusive Ajax通过...

Global site tag (gtag.js) - Google Analytics