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的具体 ...
随机推荐
- Ubuntu输入su命令提示认证失败的解决办法
Ubuntu安装后,root用户默认是被锁定了的,不允许登录,也不允许执行"su命令到root".对于桌面用户而言,这样可以提高安全性.但对于服务器可以设置成允许"su命 ...
- NodeJS 加入windows7服务 开机运行 nssm
from:http://blog.sina.com.cn/s/blog_5ef5f2630101aql8.html 首先需要到http://nssm.cc/download/?page=downloa ...
- js hash
1)新建hash hash= { name : "image", "number" : &q ...
- springboot-vue项目前台2
api_account.js import * as API from './' export default { //登录 login: params => { return API.POST ...
- springboot-整合freemarker
freemarker是一个页面模板引擎.用springboot整合freemarker的方式如以下步骤: 1.在创建springboot的项目的时候,选择freemarker的组件,或者自己手动在ma ...
- Java虚拟机的平台无关性与语言无关性
平台无关性 不同平台的不同java虚拟机,都执行同一种字节码文件,即Class文件 语言无关性 Java虚拟机不止能执行java程序,还有Clojure.Groovy.JRuby.Jython.Sca ...
- windows 服务安装报错
使用windows服务开发的定时任务,在win7上都运行良好,在windows server 2008上运行报错,报错信息如下 错误应用程序名称: GCWindowsService.exe,版本: 1 ...
- Pandas标记删除重复记录
Pandas提供了duplicated.Index.duplicated.drop_duplicates函数来标记及删除重复记录 duplicated函数用于标记Series中的值.DataFrame ...
- mysql基础(1)-基本操作
数据库 数据库(Database,DB)是数据的集合,是一个长期存储在计算机内的.有组织的.有共享的.统一管理的数据集合. 存储数据 管理数据 数据库类型 关系型数据库:由二维表及其之间的联系组成的一 ...
- MySQL数据库设置主从同步
MySQL主从同步的机制: MySQL同步的流程大致如下: 1.主服务器(master)将变更事件(更新.删除.表结构改变等等)写入二进制日志(master log). 2.从服务器(slave)的I ...