首页 > 开发 > AJAX > 正文

SSH+Jquery+Ajax框架整合

2024-09-01 08:28:17
字体:
来源:转载
供稿:网友

近期学习了SSH2(Struts2+Spring+Hibernate)的整合后,开始尝试的写一个登陆界面,结果发现:若是单单使用struts2来进行页面跳转的话页面的效果不怎么样,同时也无法进行局部刷新(即异步提交验证)。

于是,我开始在网上搜索解决的办法,有些说通过一个隐藏的iframe来达到效果,当我总觉得麻烦和不实用。后来问了下老师,告诉了我使用ajax可以达到想要的效果,我又发现网上有很多例子都是ajax的,但缺少的就是SSH2(整合好的)和ajax 的整合(ajax使用了jQuery框架)。

说说我想要的效果:

登录页面点击提交后 进行后台的验证;

验证成功跳转到index.Jsp;

验证失败则在本登录页面执行一个jQuery脚本提示用户;

需要的包:

SSH2使用到的包外,还需要struts2的以下包:

commons-beanutils-1.8.0.jar
commons-collections-3.1.jar
commons-fileupload-1.3.1.jar
commons-io-2.2.jar
commons-lang-2.4.jar
commons-lang3-3.1.jar
commons-logging-1.1.3.jar
ezmorph-1.0.6.jar
freemarker-2.3.19.jar
json-lib-2.3-jdk15.jar
ognl-3.0.6.jar
struts2-core-2.3.16.3.jar
struts2-json-plugin-2.3.16.3.jar
xwork-core-2.3.16.3.jar

好了,开始贴代码:

login.jsp

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type"content="text/html; charset=utf-8" /><title>会员登陆</title><!-- 必须添加jQuery 否则ajax将不启用。--><script type="text/javascript"src="js/jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $("#button").click (function(){varuser =$("#User").val();varpassWord =$("#PassWord").val();   $.ajax({         //这里的需要Struts.xml的<action/>的name属性一致。       url:‘login.action‘,       //提交类型       type:‘POST‘,        //提交数据给Action传入数据        data:{‘User‘:user,‘PassWord‘:passWord},        //返回的数据类型       dataType:‘json‘,        //成功是调用的方法       success:function(data){        //获取Action返回的数据用  data.Action中的属性名 获取          if(data.result=="false")          {           alert("账号密码错误");          }elseif(data.result=="true"){           //进行页面跳转,因为ajax我们的Action只返回数据,不在进行跳转了...          location.href = "index.jsp";          }          }       });  });  });</script> </head> <body>

  账号:<input id="User" name="User"type="text" /><br/>

  密码:<input id="PassWord" name="PassWord"type="password"  /><br/>

 <input id="button" type="button"value="提交" /> </body></html>

LoginAction.java

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表