jquery中ajax的使用(java)
AJAX方式
js:界面
var prjContextPath='<%=request.getContextPath()%>';
$(document).ready(function(){
//===============GET==============================
$("#username").blur(function(){
$.ajax({
type: "GET",
url: prjContextPath + "/zhuceAction!queryUserName.action?username=" + $("#username").val()+"&pwd="+$("#pwd").val(),
dataType: "json",
success: function(data) {
if (data.success) {
$("#usernamemsg").html("<font color='green'>" + data.msg + "</font>");
} else {
$("#usernamemsg").html("<font color='red'>" + data.msg + "</font>");
}
},
error: function(jqXHR){
alert("发生错误:" + jqXHR.status);
}
});
}); //===============POST==============================
$("#username").blur(function(){
$.ajax({
type: "POST",
url: prjContextPath + "/zhuceAction!queryUserName.action",
data: {
username: $("#username").val(),
pwd: $("#pwd").val()
},
dataType: "json",
success: function(data){
if (data.success) {
$("#usernamemsg").html("<font color='green'>" + data.msg + "</font>");
} else {
$("#usernamemsg").html("<font color='red'>" + data.msg + "</font>");
}
},
error: function(jqXHR){
alert("发生错误:" + jqXHR.status);
}
});
});
});
调用的action中的方法:
注意:此action要继承BaseAction
public void queryUserName() throws IOException { System.out.println("username=" + user.getUsername());
System.out.println("pwd=" + user.getPwd());
// 去数据库中验证
boolean flag = true; //形成JSON串
String html = "";
if (flag) {
html = "{\"success\":1,\"msg\":\"用户名,可以使用!\"}";
} else {
html = "{\"success\":0,\"msg\":\"用户名,不可以使用!\"}";
} // 调用BaseAction中的方法向输出流中写JSON串
responseWriterJSON(html); }
BaseAction代码:
package action; import java.io.IOException;
import java.io.PrintWriter; import javax.servlet.http.HttpServletResponse; import org.apache.struts2.ServletActionContext; public class BaseAction { public HttpServletResponse response;
/**
* 返回页面数据
* @param returnString 返回数据
* @throws IOException 异常
*/
public void responseWriterJSON(String returnString) throws IOException { response = ServletActionContext.getResponse();
response.setContentType("application/json;charset=utf-8"); response.getWriter().write(returnString);
response.flushBuffer();
response.getWriter().close(); }
/**
* 返回页面xml数据
* @param returnString 返回数据
* @throws IOException 异常
*/
public void responseWriterXML(String returnString) throws IOException { response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache"); response.getWriter().write(returnString);
response.flushBuffer();
response.getWriter().close(); }
/**
* 返回页面数据
* @param returnString
* @throws IOException 异常
*/
public void printWriter(String returnString) throws IOException { response = ServletActionContext.getResponse();
response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter();
out.println(returnString);
out.close(); } }
POST方式
js:
//-----------对用户名进行查询start-------------------------------------------
$(document).ready(function() { query(); }); //-----------对用户名进行查询end-------------------------------------------
//加载查询土地登记审批表(判断:add/update/search)
function query()
{
var username = "aa";
var pwd = "bb"; $.post(prjContextPath+"/updateAction!query.action",
{username:username,pwd:pwd},callBackQuerySuccess);
} function callBackQuerySuccess(json)
{ if(json.data != null || json.data !="")
{
//向页面赋值
/*
* 方法1
for(var i=0;i<json.data.length;i++)
{ var tbBody = "";
var trColor="";
alert("i="+i);
var editData=json.data[i]; if (i % 2 == 0) {
trColor = "even";
}
else {
trColor = "odd";
}
tbBody += "<tr class='" + trColor + "'><td>" + editData.name + "</td>" + "<td>" + editData.age + "</td></tr>";
$("#myTb").append(tbBody); }
*/ //向页面赋值方法2
var typeData = json.data;
$.each(typeData, function(i, n) {
var tbBody = ""
var trColor;
if (i % 2 == 0) {
trColor = "even";
}
else {
trColor = "odd";
}
tbBody += "<tr class='" + trColor + "'><td>" + n.name + "</td>" + "<td>" + n.age + "</td>" + "<td>" + n.like[0] + "</td></tr>";
$("#myTb").append(tbBody);
}); }
}
action:
package action; import java.io.IOException;
import java.util.ArrayList;
import java.util.List; import bean.User;
import bean.UserInfo; import com.alibaba.fastjson.JSON;
import com.opensymphony.xwork2.ModelDriven; public class UpdateAction extends BaseAction implements ModelDriven<User> { User user = new User(); public User getModel() {
return user;
} public void query() throws IOException { System.out.println("username=" + user.getUsername());
System.out.println("pwd=" + user.getPwd()); UserInfo userinfo = new UserInfo();
userinfo.setName("张三");
userinfo.setAge(20);
userinfo.setBirthday("1990-10-09");
String[] likes = new String[] { "篮球", "足球" };
userinfo.setLike(likes);
userinfo.setHasgirlfirend(false);
userinfo.setCar(null); UserInfo userinfo2 = new UserInfo();
userinfo2.setName("李四");
userinfo2.setAge(20);
userinfo2.setBirthday("1991-11-11");
String[] likes1 = new String[] { "台球", "羽毛球" };
userinfo2.setLike(likes1);
userinfo2.setHasgirlfirend(false);
userinfo2.setCar(null);
List<UserInfo> userJsonList = new ArrayList<UserInfo>();
userJsonList.add(userinfo);
userJsonList.add(userinfo2); String jsonArray = JSON.toJSONString(userJsonList); StringBuffer responseString = new StringBuffer();
responseString.append("{\"total\":")
.append(2)
.append(",\"data\":")
.append(jsonArray)
.append("}"); System.out.println(responseString.toString()); // 调用BaseAction中的方法向输出流中写JSON串
responseWriterJSON(responseString.toString());
/**
{
"total": 2,
"data": [{
"age": 20,
"birthday": "1990-10-09",
"hasgirlfirend": false,
"like": ["篮球", "足球"],
"name": "张三1"
}, {
"age": 20,
"birthday": "1990-10-09",
"hasgirlfirend": false,
"like": ["篮球", "足球"],
"name": "张三"
}]
}
*/
} }
jquery中ajax的使用(java)的更多相关文章
- jquery中ajax的使用
Java软件开发中,后台中我们可以通过各种框架,像SSH等进行对代码的封装,方便我们对Java代码的编写,例如,Struts,SpringMVC对从前台到action的流程进行封装控制,使我们只需要进 ...
- 通过Jquery中Ajax获取json文件数据
1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : ...
- Ajax -异步请求 -jquery中ajax分类 -第一层 $.ajax -第二层($.get /$.post) -第三层($.getJson/$.getScript) -相应演示
Ajax 1.标准请求响应时浏览器的动作(同步操作) 1.1浏览器请求什么资源,跟随显示什么资源2.ajax:异步请求. 2.1局部刷新,通过异步请求,请求到服务器资源数据后,通过脚本修改页面中部分内 ...
- jQuery中ajax的4种常用请求方式
jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数 ...
- jquery中ajax的简单使用
一.load() 这是最简单的一个函数,传入一个url他会异步加载该url的内容,然后将内容插入每一个选中的元素中,替换掉其中已经存在的内容. 所以最简单的用法是: $("#myDiv&qu ...
- jQuery中ajax应用
一:Ajax介绍 1.ajax的定义:客服端js所发起的http请求的代号,无刷新的数据更新. 2.ajax原理: 运用XHTML+CSS来表达信息,运用javascript操作DOM(Documen ...
- 关于Jquery中ajax方法data参数用法的总结
data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...
- [转]Jquery中AJAX错误信息调试参考
下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求 ...
- 转载 Jquery中AJAX参数详细介绍
Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ...
随机推荐
- thinkphp验证码实现。
作为我大天朝的程序员,如果不会点thinkphp框架确实有点说不过去了(虽然作为菜鸟的我才入坑没几个月).不过不会也没关系,很简单的一个php框架.今天为大家介绍的是thinkphp如何实现验证码的功 ...
- __name__ 和 "__main__"
本模块名: person 调用者模块名: start import sys def funcperson(): print('我是人') print(sys.modules[__name__]) # ...
- php 操作RabbitMQ
本文摘抄自:https://www.cnblogs.com/alin-qu/p/8312874.html php 操作RabbitMQ 基本流程图 如果exchange 没有绑定queue,则消息 ...
- JavaScript实现判断图片是否加载完成的3种方法整理
JavaScript实现判断图片是否加载完成的3种方法整理 有时候我们在前端开发工作中为了获取图片的信息,需要在图片加载完成后才可以正确的获取到图片的大小尺寸,并且执行相应的回调函数使图片产生某种显示 ...
- uva 12096 - The SetStack Computer(集合栈)
例题5-5 集合栈计算机(The Set Stack Computer,ACM/ICPC NWERC 2006,UVa12096) 有一个专门为了集合运算而设计的"集合栈"计算机. ...
- 内存泄漏导致程序killed
示例程序: #include<stdio.h> #include<unistd.h> int main() { ) { *]; } ; } 执行结果: 程序消耗完内存会被kil ...
- linux-课题练习1
1.创建组testgroup: 2.创建用户a2012,先采用默认设置创建,然后使该用户加入testgroup组. 3.创建用户a2013,其用户主目录为/tmp/a2013,其主组为testgrou ...
- maven 添加自己下载的jar包到本地仓库
1.在pom文件中添加依赖,其中groupId等变量都自拟. 例如: 2.在命令行执行以下命令,提示build success即表示安装成功. mvn install:install-file -Dg ...
- (数据科学学习手札03)Python与R在随机数生成上的异同
随机数的使用是很多算法的关键步骤,例如蒙特卡洛法.遗传算法中的轮盘赌法的过程,因此对于任意一种语言,掌握其各类型随机数生成的方法至关重要,Python与R在随机数底层生成上都依靠梅森旋转(twiste ...
- TopCoder SRM 489 Div1 Lev3:AppleTree
挺优秀的一道题,想出做法时有些惊艳. 题意: 数轴上有\(D\)个连续整数刻度,有\(N\)棵树要种在这些刻度上,其中第\(i\)棵与两旁(如果有的话)相邻的树至少要相距\(R_i\),问方法数. \ ...