Ajax与后台的交互
Ajax Java 交互
jsp代码
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <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">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<script type="text/javascript">
var xmlHttprequest = null; function ajax(){
if(window.ActiveXObject){
xmlHttprequest = new ActiveXObject("Microsoft.XMLHTTP"); }else if(window.XMLHttpRequest){
xmlHttprequest = new XMLHttpRequest; } if(xmlHttprequest != null){ var v1 = document.getElementById("v1").value;
var v2 = document.getElementById("v2").value; xmlHttprequest.open("post","ajaxServlet.do",true); xmlHttprequest.onreadystatechange=ajaxCallBack; xmlHttprequest.setRequestHeader("Content-type",
"application/x-www-form-urlencoded"); xmlHttprequest.send("v1="+v1+"&v2="+v2); } } function ajaxCallBack(){ if(xmlHttprequest.readyState == 4){
if(xmlHttprequest.status == 200){ var responseText = xmlHttprequest.responseText;
document.getElementById("div").innerHTML = responseText;
} }else{
document.getElementById("div").innerHTML="服务器出现错误!";
}
} </script>
<body>
<input type="button" value="click here" onclick="ajax();" />
<input type="text" id="v1"></input>
<input type="text" id="v2"></input> <div id="div"></div> </body>
</html>
java后台
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 AjaxServlet extends HttpServlet{ /**
*
*/
private static final long serialVersionUID = 1733653367006626421L; @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
doPost(req, resp);
} @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
PrintWriter out = resp.getWriter();
String v1 = req.getParameter("v1");
String v2 = req.getParameter("v2"); out.print(v1+v2+"dadasdsadsa");
out.flush();
} }
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <servlet>
<servlet-name>ajax</servlet-name>
<servlet-class>AjaxServlet</servlet-class>
</servlet> <servlet-mapping>
<servlet-name>ajax</servlet-name>
<url-pattern>*.do</url-pattern> </servlet-mapping>
</web-app>
Ajax与后台的交互的更多相关文章
- jqeuery $.ajax 与后台jsone交互
============================action后台,我这里是SpringMVC================================================@C ...
- 前后端通信中使用Ajax与后台接口api交互(以登录功能为例)
一.查阅开发文档 首先,要做这个功能前,我们必须先查阅后台接口文档,了解使用登录接口时,需要提交哪些参数,并且接口使用返回的数据. 这里我使用了一个返回json格式数据的登录接口为例,讲解怎么使用Aj ...
- Spring Mvc模式下Jquery Ajax 与后台交互操作
1.基本代码 1)后台控制器基本代码 @Controller @RequestMapping("/user") public class UserController { @Aut ...
- ajax简单后台交互
ajax简单后台交互 1,扯淡 单身的生活,大部分时间享受自由,小部分时间忍受寂寞. 生活有时候,其实蛮苦涩,让人难以下咽.那些用岁月积累起来的苦闷,无处宣泄,在自己的脑海里蔓延成一片片荆棘,让你每每 ...
- .net Ajax与后台一般处理程序(ashx) 交互
本文主要实现无动态刷新查询后台数据功能,主要用到ajax+ashx+sqlserver进行交互. 首先需要引用Jquery: <script language="javascript& ...
- 通过PHP前端后台交互/通过ajax前端后台交互/php基础传输数据应用/简单的留言版/简单的注册账户/简单的登录页/
前 言 PHP 通过上一篇博客,注册账号与登录页面--前后台数据交互 跳转转到index主页,接下来进入主页留言板功能,通过ajax向后台传输数据,同时发表留言. 具体的内容分析如下 ...
- ajax简单后台交互-我们到底能走多远系列(28)
我们到底能走多远系列(28) 1,扯淡 单身的生活,大部分时间享受自由,小部分时间忍受寂寞. 生活有时候,其实蛮苦涩,让人难以下咽.那些用岁月积累起来的苦闷,无处宣泄,在自己的脑海里蔓延成一片片荆棘, ...
- 利用angular与后台的交互
记录的世界是强大的,不管天南海北还是五湖四海,如果利用angular js与后台的交互.angular js 在api上称为是http服务: 下面咱给一个简单的代码看看:简单的利用后台与前端的tab切 ...
- 一周一个小demo — 前端后台的交互实例
这一周呢,本K在大神的指导下,完成了一个利用ajax与php文件上传处理相结合的一个留言板功能的小实例,下面就让本K来带大家瞅瞅如何实现这一种功能. 一.界面概览 首先我们来看一下这个小demo的具体 ...
随机推荐
- vue框架(一)
一.介绍 1.Vue是什么? Vue.js (读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关 ...
- CentOS上快速安装saltstack
查看当前centos版本号 cat /etc/redhat-release 查看内核版本 uname -r 主机 1.安装master(在第一台机器上安装master) 执行: wget -O /et ...
- PsySH——PHP交互式控制台
PsySH PsySH is a runtime developer console, interactive debugger and REPL for PHP. PsySH是一个PHP的运行时开发 ...
- Hibernate多对多关联
多对多关联: 示例:Teacher和Student,一个Teacher可以教很多student,一个Student也可以被很多teacher教 多对多单向关联 Teacher知道自己教了哪些学生, ...
- Mybatis一对多/多对多查询时只查出了一条数据
问题描述: 如果三表(包括了关系表)级联查询,主表和明细表的主键都是id的话,明细表的多条数据只能查询出来第一条/最后一条数据. 三个表,权限表(Permission),权限组表(Permission ...
- C++ IPv4与IPv6的兼容编码(转,出自http://blog.csdn.net/ligt0610/article/details/18667595)
这里不再对IPv6 socket相关编程的基础知识进行讲解,只提供一个IP协议无关的服务端和客户端的代码,仅供参考. 服务端代码: #include <iostream> #include ...
- MongoDB部署指南
下載安裝包 http://www.mongodb.org/ 安裝MongoDB systemLog: destination: file path: E:\MongoDB\log\mongo.log ...
- 移动端tap或touch类型事件的点透问题认识
1.什么是点透? 举例说明:下图B元素是黄色方块,B元素中包含了C元素,C元素是一个a链接,本身自带click事件按,然后又一个半透明的粉色元素A遮盖在B元素上(看图中A元素是覆盖在B元素上的,不然B ...
- python的语法错误总结
1.keyerror一般是你使用字典里不存在的key产生的错误. 2.TypeError一般是使用的数据类型不符合要求 join函数要求a都是string
- iOS_mapKit与Core Location
目 录: 一.使用MKMap控件 二.根据地址定位 三.在地图上添加锚点 iOS从3.0版本开始提供了MapKit.frameword支持.该框架提供了一个可被嵌入到应用程序中的地图视图类MKMa ...