jQuery AJAX方法 前台往后台传数据

来源:互联网 发布:必应for mac 编辑:程序博客网 时间:2024/05/16 06:30

通过url路径传递参数

js代码

<script>   var id = 5;    boolean flag = false;   /**重点:ajax只需要type和url属性*/   $.ajax({        async : false,        cache : false,        type : 'POST',                       url : 'area/delete/'+flag+'/'+ id,//(1)请求的action路径,可以传递参数到后台        error : function() {            alert('请求失败 ');        },        success : function(data) {            alert(data);        }   });</script>

java代码

import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.ResponseBody;/*接收url中传来的参数@PathVariable("id") Long id,可以接收基本类型*/ @ResponseBody @RequestMapping(value = "area/delete/{flag}/{id}", method = RequestMethod.POST) public String deleteArea(@PathVariable("id") Long id,@PathVariable("flag") boolean flag) {        //处理参数        return "成功";    }

通过ajax的data属性

js代码

ajax前台往后台传参数,前台是字符串,后台是数组接收,那么框架会根据逗号来字符串分割成数组 看参数ids

<script>   var postData= { //(2)传递参数到后台,注意后台接收方式             "param1": "param1",            "areaId":2,            "deleteId":3,            "ids" : "254,249,248"   /**重点:ajax的type,url,dataType,data属性*/    $.ajax({            async : false,            cache : false,            type : 'POST',            url : 'area/delete',            dataType : "json",            data : postData,                        error : function() {                alert('请求失败 ');            },            success : function(data) {                alert(data);            }        });</script>

java代码

import org.springframework.web.bind.annotation.RequestParam;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.ResponseBody;/*接收data属性中传来的参数:2种方法 参数名和前台的键名保持一致,@RequestParam*/ @ResponseBody@RequestMapping(value = "area/delete", method = RequestMethod.POST)public String editAreaWithFile(String param1,Long areaId,@RequestParam("deleteId") Long deleteId,Long[] ids) {        //处理参数         //这时ids数组为[254,249,248]        return "成功";    }

或者

import javax.servlet.ServletRequest;@ResponseBody@RequestMapping(value = "area/delete", method = RequestMethod.POST)public String getSections(ServletRequest request) {    //用ServletRequest接收参数    String strRailwayId = request.getParameter("param1");    String strAreaId = request.getParameter("areaId");    Long areaId= new Long(strAreaId );    String strDeleteId = request.getParameter("deleteId");    Long deleteId= new Long(strDeleteId );     //处理参数     return "成功";}

通过ajax.data属性传递多个参数

js代码

//第一步:定义json格式数据var postData = {        "param1" : "param1",        "areaId" : 2,        "deleteId" : 3  };/**ajax的type,url,dataType,contentType,data属性*/$.ajax({        async : false,        cache : false,        type : 'POST',        url : 'area/delete',        dataType : "json",        contentType : 'application/json', //第二步:定义格式        data : JSON.stringify(postData), //第二步;把json转为String传递给后台        error : function() {                alert('请求失败 ');        },        success : function(data) {            alert(data);        } });

java代码

/**通过@RequestBody接收参数*/@ResponseBody@RequestMapping(value = "area/delete", method = RequestMethod.POST)public String editAreaWithFile(@RequestBody Map<String, Object> map) {    String param1 = (String) map.get("param1");    Integer strAreaId = (Integer) map.get("areaId");    Integer strDeleteId = (Integer) map.get("deleteId");    System.out.println("收到的参数==" + param1 + strAreaId + strDeleteId);    // 处理参数    return "成功";}
0 0
原创粉丝点击