ssm项目前后端通过Ajax异步传送数据的几个问题

本文深入探讨了前端页面数据无法传送到后台的原因及解决方法,包括数据格式问题、button与a标签的选择,以及如何正确设置dataType确保数据成功传送并被处理。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.前端页面数据无法传送到后台

      可能是页面数据格式不对,一般要JSON格式数据,关键是要与后台要求的类型相一致,如

//将获取的用户信息包裹为JSON格式
var info = {
	loginCode : code,
	password : psd
};
//异步传送
//alert("2");
$.ajax({
	url : "login.do",
	type : "POST",
	data : { user: JSON.stringify(info) },
	dataType : "text",
	success :function(data){	
	            console.log(data)
             }
});

注意不要出现语法错误,写java用的IDE如eclipse,默认是不会提示js语法错误的,运行的时候如果出现语法错误js函数就不会执行,数据就传送不出来。两个方法解决:1.给IDE开启js错误提示(设置或加插件);2.通过浏览器的检查模式查看错误提示(比如Chrome就可以右键选检查)

2.数据传送成功但success函数不执行

后台明明已收到传来的数据,但返回给前端页面的数据得不到显示,给success函数加alert也不跳出对话框。这有两种可能:        1.dataType与后端返回的数据类型不一致,例如后台给的是String,dataType设置的却是"json",success就不会执行。此时修改 dataType为正确的数据类型(或者去掉dataType)即可。这类错误可以通过加入error函数验证,如

//将获取的用户信息包裹为JSON格式
var info = {
	loginCode : code,
	password : psd
};
//异步传送
//alert("2");
$.ajax({
	url : "login.do",
	type : "POST",
	data : { user: JSON.stringify(info) },
	dataType : "text",
	success :function(data){	
	            console.log(data)
             },
    error :function(){
            alert("出错了");
          }
});

ps:dataType是预期服务器返回的数据类型。如果不指定,jQuery将自动根据 HTTP包 MIME信息来智能判断

  2.页面提交按钮选用了button,数据上送成功但所有回调函数都不执行,将点击提交的button改为a标签即可。网上搜到的解释是:  既然用了Ajax就不应该用OnClick事件。
         1、点击Button按钮,先执行OnClientClick客户端脚本,return true时进行页面回发。
        2、使用Ajax异步请求,回调函数接收数据之前,页面已经回发了。原来的页面已经不存在,上哪接收异步请求返回的结果。

参考链接:https://blog.youkuaiyun.com/plyczp150705/article/details/78602116

3.打开后台传来的页面

前端:

$.ajax({
	//登录成功后请求进入菜单页
	url:"menu.do",
	success:function(data){
	    alert(data)
        //打开菜单页
	    $(document.body).html(data);
	} 
}) 

后端:

/**
 * 菜单控制器
 */
@Controller
public class MenuController {
	
	//菜单分配,根据用户类型分配不同菜单
	@RequestMapping("/menu.do")
	public String distributeMenu(HttpSession session) {
		//取用户权限信息
		User user = (User) session.getAttribute(Constants.SESSION_USER);
		String url = null;
		if(user != null) {
			int accessId = user.getRoleid();
			System.out.println("roleid="+accessId);
			//分配菜单
			switch(accessId) {
			case 0:
				//管理菜单
				url = "admin";
				break;
			case 1:
				//普通菜单
				url = "user";
				break;
			default:
				url = "404";
				break;
			}
		}
		//System.out.println("url="+url);
		return url;
	}
	
	
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值