`
86asm
  • 浏览: 203894 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

ajax:post

阅读更多
<%@ page language="java"  pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<script type="text/javascript">
		var xmlHttp;
		function verify(){		
   			var username=document.getElementById("username").value;
   			var password=document.getElementById("password").value;
   			var param="username="+username+"&password="+password;
			try	{
    			
    			xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
    		} catch (e){
  				
   				try{
   				    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
      			} catch (e){
      			
      				try{
         				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         			}catch (e){
         				alert("您的浏览器不支持AJAX!");
         				return false;
         			}
      			}
    		}

			//1.注册回调函数
			xmlHttp.onreadystatechange=callback;
			
			//2.设置连接信息
			xmlHttp.open("POST","checkPost",true);
			//3.设置头信息
	        xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); //这个一定要写在open方法后面
			//4.发送数据,开始与服务器端交互
			xmlHttp.send(param);	
		}
		
		//回调函数代码如下:
		function callback(){
			//判断交互是否完成
			if(xmlHttp.readyState==4){
			//判断http的交互是否成功
				if(xmlHttp.status==200){
					//获取服务器端的纯文本数据
					var responseText=xmlHttp.responseText;
					document.getElementById("show").innerHTML=responseText;
				}else{
					alert("出错了");
				}
			}
		}
	</script>
  </head>
  
  <body>
	<form action="" method="post">
	 用户名:	<input type="text" name="username" id="username" ><br>
	 密码:	<input type="password" name="password"id="password" onBlur="verify();"><br>
	 <div id="show"></div><br>
	 <input type="submit">
	</form>
  </body>
</html>

 ajax:post 提交方案:注意的是一定要先建立连接,再设置头信息

 

package com.asm.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class AjaxServletPost extends HttpServlet {

	private static final long serialVersionUID = 1L;

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException,
			IOException {
		this.doPost(req, resp);
	}

	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("UTF-8");
		response.setContentType("text/html;charset=UTF-8");
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		PrintWriter out = response.getWriter();
		// out.write("你输入的用户名为: + + "</font>");
		out.println("你填入的结果为:<br>");
		out.println("<font color='red'> username="+username+" || password="+password+"</font>");
	}
}
 
分享到:
评论

相关推荐

    Ajax:Web2.0 开发技术详解

    6. **jQuery和Ajax**:jQuery库简化了Ajax的使用,书中可能包含jQuery的Ajax方法,如$.ajax()、$.get()、$.post()等,并展示如何结合jQuery进行Ajax开发。 7. **Ajax应用实例**:通过具体的网页应用示例,如动态...

    Ajax中get和post区别

    "Ajax中Get和Post请求的区别" Ajax作为异步JavaScript和XML的简写,是一种创建交互式网页的技术。其中,Get和Post是两种常用的HTTP请求方法,尽管它们都是用于将数据从客户端发送到服务器端,但是它们之间存在着很...

    ajax POST 与GET提交的区别

    ### AJAX POST 与 GET 提交的区别详解 #### 一、GET与POST基本概念及应用场景 在探讨AJAX中GET和POST的区别之前,我们先来了解一下这两种请求方式的基本概念。 **GET**请求通常用于获取资源信息,它将参数拼接到...

    详细解读Jquery各Ajax函数:$.get(),$.post(),$.ajax(),$.getJSON()

    而Jquery库提供了一系列封装好的Ajax函数,如$.get(), $.post(), $.ajax(), 和$.getJSON(),这些函数简化了前端开发者与后端数据交互的过程。 ### 1. $.get() `$.get()`函数是最简单的一种异步请求方式,它发送一...

    Ajax的Post请求

    最近做项目遇到一个需求,需要通过Ajax的post请求下载文件,把实现代码分享给大家。

    理解Ajax:用Javascript构建Web程序(CHM电子书)

    **Ajax(Asynchronous JavaScript and XML)**是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新,提升了用户体验,使得用户在等待数据...

    jQuery ajax、post、get、json格式传递数据例子

    本篇文章将深入探讨jQuery中的ajax、post、get方法以及如何使用json格式传递数据。 1. **jQuery的$.ajax()函数** `$.ajax()`是jQuery提供的核心Ajax功能,它可以实现异步数据交互。通过配置各种参数,可以灵活地...

    Ajax的post方法的使用

    ### Ajax的POST方法详解 #### 一、引言 在Web开发中,异步JavaScript与XML(Ajax)技术被广泛应用于提升用户体验,实现无需刷新页面即可加载数据的功能。本文将重点探讨Ajax中的POST方法,包括其基本原理、应用...

    深入浅出Ajax(Head Rush Ajax) 源码 书中代码

    - GET和POST请求的发送 - 异步处理与回调函数 3. **第三章:处理响应** - 解析XML和JSON数据 - DOM操作与动态内容插入 - 错误处理和状态监测 4. **第四章:提升用户体验** - 使用Ajax进行页面局部更新 - ...

    ajax快速解决参数过长无法提交成功的问题

    在ajax中使用post方法,用常规的参数格式:param1=a1&param2=a2 ,当参数长度过长时,依然提交不成功。比如我们经常这样写一个ajax的post请求: $.ajax({ type: "post", // post or get contentType:"application...

    ajax跨域post(java例子)

    本篇文章将详细讲解如何使用Ajax进行跨域POST请求,并结合Java的Spring框架给出具体示例。 ### 1. 跨域请求的概念 跨域请求是指一个域下的文档或脚本尝试请求另一个域下的资源。出于安全考虑,浏览器默认禁止这种...

    图书馆添加删除判断 ajax.get 请求 ajax.post响应 考试专用

    本话题将详细讲解如何在图书馆管理页面中利用AJAX实现图书的添加、删除和判断功能,以及处理AJAX的GET请求和POST响应,这些都是前端开发者在考试或实际项目中经常遇到的场景。 首先,我们要理解AJAX的基本原理。...

    Django解决Ajax中post提交数据403的代码

    然而,在使用Ajax向Django后端发送POST请求时,可能会遇到403 Forbidden错误,提示“CSRF token missing or incorrect.”。这个问题是由于Django的安全机制——跨站请求伪造(Cross-Site Request Forgery,简称CSRF...

    Ajax实战:实例详解源代码

    2. 打开连接,指定请求类型(GET、POST等)、URL和是否异步。 3. 设置响应处理函数,当请求状态改变时执行。 4. 发送请求。 ### 三、数据格式 虽然名称中包含XML,但Ajax并不仅限于处理XML数据,还可以处理JSON、...

    ajax总结:formdata,get,post,ajax等

    ajax总结,load,get,post,ajax总结,还有formdata~~~

    Ajax中get与post请求详解

    Ajax 中 get 与 post 请求的详细解释 Ajax 技术中 get 与 post 两种请求方式是许多开发者经常遇到的疑问,以下将详细解释两者的区别,并提供实例代码。 一、get 与 post 的基本区别 1. 参数传递方式:get 请求将...

    ajaxRequest.js(ajax get post方法封装,方便前端调用)

    封装jquery ajax方法,方便调用,避免在代码中频繁使用 $.ajax({ type: 'GET', url: url, ...... )}; 统一调用公共方法即可,区分同步异步,get post!希望对大家有帮助

    Java 模拟Ajax POST GET 提交代码

    Java 模拟Ajax POST GET 提交代码,实测很好用。

    ajax中使用javascript的send方法post参数

    ### AJAX中使用JavaScript的send方法POST参数详解 #### 一、引言 在Web开发中,AJAX(Asynchronous JavaScript and XML)技术被广泛应用于实现网页的局部刷新,提升用户体验。其中,通过JavaScript发送POST请求是一...

    php+Ajax(GET&POST)完美实例

    2. Ajax的GET和POST请求实现。 3. 解决Ajax请求中文乱码问题。 4. PHP接收和发送JSON数据。 5. 结合MySQL数据库进行数据交互。 通过这个实例,开发者可以学习到如何创建一个能够动态获取和提交数据的Web应用,同时...

Global site tag (gtag.js) - Google Analytics