Ajax案例
展示页面jsp：
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body> <script type="text/javascript"> function getData() { //创建ajax引擎对象
var ajax;
var name=document.getElementById("tid").value;
//console.log(name);
if(window.XMLHttpRequest){//火狐
ajax= new XMLHttpRequest();
}else if(window.ActiveXObject){//ie
ajax=new ActiveXObject("Msxml2.XMLHTTP");
} //复写onreadyststement
ajax.onreadystatechange = function () {
//判断ajax状态码
if(ajax.readyState==4){
//alert(5);
//判断响应状态码（200、405、404、500）
if(ajax.status==200){
//获取响应内容（相应内容的格式）
var res=ajax.responseText;
//console.log(res[0]+" "+res[1]);
eval("var obj="+res);
//alert(obj.heroName);
//console.log(obj.name);
//alert(res);
//alert(obj.name);
//alert(obj);
if(obj!=null){
document.getElementById("d1").innerHTML="";
var ta=document.getElementById("tt");
ta.innerHTML="";
var tr=ta.insertRow(0);
tr.insertCell(0).innerHTML="编号";
tr.insertCell(1).innerHTML="生命值";
tr.insertCell(2).innerHTML="属性";
tr.insertCell(3).innerHTML="描述"; var ts=ta.insertRow(1);
ts.insertCell(0).innerHTML=obj.heroName;
ts.insertCell(1).innerHTML=obj.lifeNum;
ts.insertCell(2).innerHTML=obj.type;
ts.insertCell(3).innerHTML=obj.desc;
}else{
//eval("var obj="+"查无此人");
document.getElementById("d1").innerHTML="查无此人"; //document.write("error");会重新刷整个页面
} }else if(ajax.status==404){ }else if(ajax.status==500){ } } }
ajax.open("get","user?name="+name);
ajax.send(null);
} </script>
英雄名称：<input type="text" name="uname" value="" id="tid">
<input type="button" value="搜索" onclick="getData()">
<div id="d1"></div>
<table border="1px" id="tt"> </table>
</body>
</html>
处理Servlet：
package com.zyb.Servlet; import java.io.IOException; import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import com.google.gson.Gson;
import com.zyb.Service.UserService;
import com.zyb.ServiceImp.UserServiceImp;
import com.zyb.pojo.User;
@WebServlet("/user")
public class UserServlet extends HttpServlet{
@Override
protected void service(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
//设置请求编码格式
req.setCharacterEncoding("utf-8");
//设置响应编码格式
resp.setCharacterEncoding("utf-8");
resp.setContentType("text/html;charst=utf-8");
//获取请求信息
String name=req.getParameter("name");
System.out.println("英雄名为:"+name);
//name=name.replaceAll(" ","");
//System.out.println(name.contains(" "));
//处理请求
//获取业务层对象
UserService us = new UserServiceImp();
User u = us.getUserInfoService(name);
System.out.println("查询结果为："+u);
//resp.getWriter().write("var obj={}; obj.name="+u.getHeroName()+";obj.lifenum="+u.getLifeNum()+
// ";obj.type="+u.getType()+";obj.desc="+u.getDesc()+";"); /*resp.getWriter().write("{name:"+u.getHeroName()+
",lifenum:"+u.getLifeNum()+
",type:"+u.getType()+
",desc:"+u.getDesc()
+"}");*/ resp.getWriter().write(new Gson().toJson(u));
//System.out.println("var obj={}; obj.name="+u.getHeroName()+";obj.lifenum="+u.getLifeNum()+
// ";obj.type="+u.getType()+";obj.desc="+u.getDesc()+";");
//响应请求
}
}
业务层（Service）：
package com.zyb.Service;
import com.zyb.pojo.User;
public interface UserService {
User getUserInfoService(String name);
}
package com.zyb.ServiceImp; import com.zyb.Dao.UserDao;
import com.zyb.DaoImp.UserDaoImpl;
import com.zyb.Service.UserService;
import com.zyb.pojo.User; public class UserServiceImp implements UserService{
//获取Dao层对象
UserDao ud = new UserDaoImpl();
@Override
public User getUserInfoService(String name) {
// TODO Auto-generated method stub
return ud.getUserInfo(name);
} }
实体类：
package com.zyb.pojo;
public class User {
private String heroName;
private int lifeNum;
private String type;
private String desc;
public String getHeroName() {
return heroName;
}
public void setHeroName(String heroName) {
this.heroName = heroName;
}
public int getLifeNum() {
return lifeNum;
}
public void setLifeNum(int lifeNum) {
this.lifeNum = lifeNum;
}
public String getType() {
return type;
}
public void setType(String type) {
this.type = type;
}
public String getDesc() {
return desc;
}
public void setDesc(String desc) {
this.desc = desc;
}
@Override
public int hashCode() {
final int prime = 31;
int result = 1;
result = prime * result + ((desc == null) ? 0 : desc.hashCode());
result = prime * result + ((heroName == null) ? 0 : heroName.hashCode());
result = prime * result + lifeNum;
result = prime * result + ((type == null) ? 0 : type.hashCode());
return result;
}
@Override
public boolean equals(Object obj) {
if (this == obj)
return true;
if (obj == null)
return false;
if (getClass() != obj.getClass())
return false;
User other = (User) obj;
if (desc == null) {
if (other.desc != null)
return false;
} else if (!desc.equals(other.desc))
return false;
if (heroName == null) {
if (other.heroName != null)
return false;
} else if (!heroName.equals(other.heroName))
return false;
if (lifeNum != other.lifeNum)
return false;
if (type == null) {
if (other.type != null)
return false;
} else if (!type.equals(other.type))
return false;
return true;
}
public User(String heroName, int lifeNum, String type, String desc) {
//super();
this.heroName = heroName;
this.lifeNum = lifeNum;
this.type = type;
this.desc = desc;
}
public User(){
}
@Override
public String toString() {
return "User [heroName=" + heroName + ", lifeNum=" + lifeNum + ", type=" + type + ", desc=" + desc + "]";
}
}
Dao层：
package com.zyb.Dao;
import com.zyb.pojo.User;
public interface UserDao {
User getUserInfo(String name);
}
package com.zyb.DaoImp;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import com.zyb.Dao.UserDao;
import com.zyb.pojo.User; public class UserDaoImpl implements UserDao{ @Override
public User getUserInfo(String name) {
// TODO Auto-generated method stub
User u=null;
Connection con=null;
PreparedStatement pstmt=null;
ResultSet rs=null; try {
Class.forName("com.mysql.jdbc.Driver");//注册对应的驱动
//url,"root","root"
String url= "jdbc:mysql://localhost:3306/dy?useUnicode=true&characterEncoding=utf-8&useSSL=false";
con = DriverManager.getConnection(url,"root","root");
String RequestSql="select *from s_user where uname=?";
pstmt = con.prepareStatement(RequestSql);
//name=name.replaceAll(" ", "");
pstmt.setString(1,name); rs=pstmt.executeQuery();
if(rs.next()){
u = new User();
u.setHeroName(rs.getString("uname"));
u.setLifeNum(rs.getInt("lifenum"));
u.setType(rs.getString("type"));
u.setDesc(rs.getString("desc")); } } catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}finally{
try {
if(rs!=null)
rs.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} try {
if(pstmt!=null)
pstmt.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} try {
if(con!=null)
con.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} } return u; } }
工程结构：
效果展示：
数据库设计：
Ajax案例的更多相关文章
- js调用ajax案例
js调用ajax案例 测试地址:http://www.w3school.com.cn/tiy/t.asp?f=ajax_get 嵌入下面代码,点击提交,再点击请求数据.就可以看到结果了. <ht ...
- Django-website 程序案例系列-6 ajax案例
普通ajax案例: views.py def testajax(request): h = request.POST.get('hostname') #拿到ajax传来的值 i = request.P ...
- ajax案例_校验用户名
目录 ajax案例_校验用户名 代码下载 需求 流程 搭建环境 开发代码 1_jsp 1_servlet 1_service.dao 2_servlet 2_jsp 测试后,功能实现,完结撒花 aja ...
- Ajax案例(使用ajax进行加法运算)
此案例功能实现了一边看视频一边进行加法运算,而加法运算时页面不会刷新请求 ajax代码: <script type="text/javascript" src="j ...
- Ajax 案例之三级联动
每次在博客园网站写博客,格式真的好难搞,还望好心人告知更好的编辑工具.接下来进入正题:三级联动(其效果演示可看我的博文Ajax 学习总结 末尾). 数据表设计(Oracle) 新建数据表 Employ ...
- jquery Ajax 案例
html <div class="data"><ul></ul></div> <div id="load" ...
- AJAX案例四：省市联动
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...
- AJAX案例二：简单表单验证
案例:如果用户名输入为张三,那么在失去焦点时后面会显示该用户名已被注册,否则显示可以注册! <%@ page language="java" import="jav ...
- ajax案例源码
html文件中demo2_index.html ---------------------------------------------------------------------------- ...
- Ajax案例：三级联动查询员工的信息(三张表进行内连接)
需求分析: 通过数据库连接池,可以查询到数据库中员工的各种信息,通过点击下拉框的方式实现三级联动,即:没有点击city下拉框,后面两个下拉框中没有值,这样,点击city下拉框,department下拉 ...
随机推荐
- XSS 3
打开第三题然后会看到 然后进行一下添加数据 然后会发现数据被添加到 value=""双引号中然后然后我们会想到提前闭合 代码 然后进行编码 然后就可以通过了 此题与xss 2类似 ...
- Codeforces Round #599 (Div. 2) B2. Character Swap (Hard Version)
This problem is different from the easy version. In this version Ujan makes at most 2n2n swaps. In a ...
- svn还原与本地版本回退
今天遇到了一个情况,由于没及时更新,对整个项目进行了Ctrl+shift+O,提交代码时冲突:然后就先还原项目,导致之前没有冲突的代码也回退了.然后就在eclipse中获取本地的版本记录,并回退 具体 ...
- RedHat7 / CentOS 7 忘记root密码修改
摘自:https://blog.csdn.net/bubbleyang/article/details/91360856 进入互动式命令环境 开机出现 grub boot loader 开机选项菜单时 ...
- GITlab安装、使用及新项目推送到gitlab
==================================================================================================== ...
- Springboot 中AOP的使用
面向切面编程(Aspect Oriented Programming) 是软件编程思想发展到一定阶段的产物,是面向对象编程的有益补充.AOP一般适用于具有横切逻辑的场合,如访问控制.事务管理.性能检测 ...
- thinkphp 3.2链接Oracle数据库，查询数据
ennnn,换工作了,开始用新的东西了,最近就是调用nc接口,数据库是Oracle,首先先把数据查出来,这个比较简单. 在网上看的其他的方法都是改数据库配置文件,然后需要修改tp核心的一个类文件,比较 ...
- MyCat of Middleware
第一章 入门概述 1.1 是什么 Mycat 是数据库中间件. 1.数据库中间件 中间件:是一类连接软件组件和应用的计算机软件,以便于软件各部件之间的沟通. 例子:Tomcat,web中间件. 数据库 ...
- 17，a：img的alt和title有何异同？ b：strong与en的异同？
alt(alt text):为不能显示的图像,窗体或者applets的用户代理,alt属性用来指定替换文字.替换文字的语言用lang属性来指定. eg:下例中将图像作为链接来使用 <a href ...
- scrapy import CrawlSpider 报错
from scrapy.spider import CrawlSpider 报错 import module CrawlSpider error 看了下以前一直用的scrapy0.14.1 使用的是B ...