您的位置:首页 > 编程语言 > Java开发

spring mvc+ajax实现数据交互

2017-11-10 09:21 316 查看
   开发步骤(使用jquery实现):

     1.导入jquery库,把jquery-1.11.1.js拷贝到WebContent/js目录下

     2.修改jsp页面,实现jquery交互功能

       1).模拟一个帐号检查功能

       2).当用户输入注册帐号后,失去焦点时检查帐号-使用ajax检查

          <input name="userName"  onblur="checkUserName();"   type="text" />

          编写两个函数,一个用于提交请求,一个用于处理服务器返回的结果(回调函数)

          <script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript">
  //ajax操作函数
  function checkUserName(){
  //$("a[target='_blank']")

  //1.作业:jquery的选择器都有哪些?写出你常用的5个选择器.
  var uname = $("input[name='userName']").val();  
alert(uname);
$.post("user/checkuser.do",{userName:uname},doResult);
  }
  //回调函数
  function doResult(data){
  alert(data);
  }
</script>

      3.修改Controller,处理ajax请求并返回json数据   -- 使用json进行交互: 文本(普通字符),json,xml

        @RequestMapping("/checkuser")
@ResponseBody
public String checkUser(UserInfo userInfo){
logger.info("checkUser ================= "+userInfo.getUserName());

return "{\"success\":\"true\"}";//返回json格式的字符串
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: