注意:如果ajax请求时参数中有中文,哪么get会出现乱码,使用post可解决
1:绑定事件调用ajax
- $(document).ready(function() {
- $('#example').dataTable();
- $('#channelBandwidth').click( function() {
- $.ajax({
- ContentType:'application/x-www-form-urlencoded', type:'get',//可选get
- url:'${projectPath}/test',
- data:'data=3',//传给PHP的数据,多个参数用&连接
- dataType:'text',//服务器返回的数据类型 可选XML ,Json jsonp script htmltext等
- success:function(msg){
- alert(msg);
- },
- error:function(){
- alert('error');
- }
- })})
- });
2:后台使用spring mvc传值
- @RequestMapping("/test")
- public String gettset(HttpServletRequest request,
- HttpServletResponse response) throws Exception {
- response.setContentType("text/plain" + ";charset=UTF-8");
- response.setHeader("Pragma", "No-cache");
- response.setHeader("Cache-Control", "no-cache");
- response.setDateHeader("Expires", 0);
- response.getWriter().write("aaa");
- response.getWriter().flush();
- return null;
- }
如果要传多个数据可用json
data:{"channelType":$('#channelType').val(),"channel":$('#channel').val(),"day":$('#day').val(),"startTime":$('#startTime').val(),"endTime":$('#endTime').val(),"database":$('#database').val()},
使用其它格式返回(@ResponseBody 直接返回body)
- @RequestMapping("/update")
- public @ResponseBody
- Map<String, String> updateBandwidth(@ModelAttribute SearchBean searchBean) {
- Map<String, String> map = new HashMap<String, String>();
- try {
- bandwidthService.upBandwidth(searchBean);
- String jo = bandwidthService.getBandwidth(searchBean);
- map.put("status", "ok");
- map.put("msg", jo);
- } catch (UpdateDataBasesException e) {
- logger.error(e.getMessage());
- map.put("status", "no");
- map.put("msg", "更新数据失败,请到操作记录页重新操作");
- }
- return map;
- }
前台页面ajax使 dataType:‘json’
3:spring mvc 前台ajax传值给后台,前台传值为数组,数组中为对象
前台
- function submit_alarmmessage(){
- var alarmmessage_list=new Array();
- if($('#sms').attr("checked")=="checked"){
- var tempObj=new Object();
- tempObj.id=$('#sms_id').val();
- tempObj.cc='';
- tempObj.received=$('#smsaddress').val();
- tempObj.enable='1';
- tempObj.message_type='SMS';
- alarmmessage_list.push(tempObj);
- }
- if($('#email').attr("checked")=="checked"){
- var tempObj=new Object();
- tempObj.id=$('#email_id').val();
- tempObj.received=$('#emailaddress').val();
- tempObj.cc=$('#emailcc').val();
- tempObj.enable='1';
- tempObj.message_type='EMAIL';
- alarmmessage_list.push(tempObj);
- }
- $.ajax({
- type:'post',//可选get
- url:'${projectPath}/alarmsystemalarmmesupdate',
- data:$.toJSON(alarmmessage_list),
- contentType: "application/json; charset=utf-8",
- dataType:'text',//服务器返回的数据类型 可选XML ,Json jsonp script htmltext等
- success:function(msg){
- },
- error:function(XMLHttpRequest, textStatus, errorThrown){
- }
- })
- }
数组格式
[{"id":"6","cc":"","received":"1881","enable":"1","message_type":"SMS"},{"id":"3","received":"dongling.zhang@q.com","cc":"1111@126.com","enable":"1","message_type":"EMAIL"}]
后台接收
- @RequestMapping("/alarmsystemalarmmesupdate")
- public @ResponseBody
- String updateAlarmMessage(@RequestBody List<Map> alarmmessage_list) {
- return null;
- }
参考:
http://bbs.csdn.net/topics/390123483
http://what-is-javascript.iteye.com/blog/1735691
http://ljhzzyx.blog.163.com/blog/static/383803122013115114544562/
http://blog.csdn.net/c5906343/article/details/26482975
本文转载直:http://692088846.iteye.com/blog/1997779
相关推荐
完整的jq ajax提交表单,奖解压后jq文档加入页面中,调用就可惟了。 表单结构 <form id="myForm" action="comment.php" method="post"> Name: <input type="text" name="name" /> Comment: <...
脚本简介jQ AJAX文件上传是一款基于jquery实现的PHP迷你AJAX文件上传表单。
jQ AJAX文件上传表单 jQuery AJAX文件上传表单代码下载.zip
基于Jq的ajax无刷新,图片上传,这里只写了,前端如何获取图片信息,然后利用ajax上传,后台的话,原来怎么操作文件就怎么操作,不需要做特殊处理
Asp.Net WebApi 上传文件方法: 实现功能: 1.原生js调用api上传 2.jq ajax调用api上传 上传文件
用户注册,简单的模仿用户注册效果,判定用户名是否存在,还有一些基本的判定
JQ+ajax实现异步调用 一个简单的小例子
myeclipse开发的, 弘扬开源精神,杜绝积分下载 刚出炉的例子
Servlet+jqAjax+json jar包 异步传输实例
工作之余写的一些Ajax应用,有6个Demo,数据库为mysql,使用之前看readme.txt。javascript与jquery混用。无刷新购物车、输入提示、表格局部刷新、xml实时数据更新、划词解释。
目前大多门户网站加载发表微博等信息时,都应用了滚动加载页面,使其给客户更加友好话,且减少了数据库压力。是不错的技术想法。
JQuery+ajax实现批量上传图片 JQuery+ajax实现批量上传图片 JQuery+ajax实现批量上传图片
AJAX-Cache是一款jQuery缓存插件,可以为$.ajax()方法扩展缓存功能
ajax的同步异步请求,分别用 jquery和 javascript的方式另外和 jsonp 的请求方式
jq_ajax的练习 可进行参考练习ajax
设备缺陷管理 三层架构 DIV+CSS+AJAX+JQuery
一个完整的jquery+ajax传送请求的实例
JQuery ajax的各种使用方法示例和说明 本示例程序由VS2010建立 c# asp.net ajax demo
Jquery ajax 读取txt文件 Jquery分页 Jquery ajax 读取txt文件 Jquery分页
// 2 使用$.ajax发送fd // 需要指定两个属性 // - processData : false // - contentType : false $.ajax({ method : 'POST', url : '/ajax_Day5/datas03.php', data : fd, success : function (data) { ...