利用Ajax提交表单

Html表单

用户名:<input type="text" name="username" id="username1"/><br>
密码:<input type="password" name="password" id="password1""/><br> <input type="button" value="登陆" id="btn"/>

Ajax部分

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-2.1.4.js"></script>
    <script type="text/javascript"> $(document).ready(function(){ $("#btn").click(function(){ $.ajax({ type:'POST', url:'${pageContext.request.contextPath}/Login/loginVerify', //data发送请求数据,val()为文本内容 //不能进行输入写的Html标签文本内容用text()获取 data:{ username:$("#username1").val(), password:$("#password1").val() }, success:function(data){ //JS输出JSON数据 alert(data.message); }, error:function(){ alert("服务器异常"); } }); }); }); </script>

后台Servet部分

@RequestMapping(value="loginVerify",method=RequestMethod.POST)
public void loginVerify(HttpServletRequest request , HttpServletResponse response,User user) throws Exception{
        String username = user.getUsername();
        String password = user.getPassword();
        //设置response的编码方式
        response.setCharacterEncoding("utf-8");
        //设置response的返回数据类型,JSON数据
        response.setContentType("application/json;charset=utf-8");
        if(username==null||password==null||"".equals(username)||"".equals(password)){
            //JSON中写入字符串要用\"转义,''单引无效
            response.getWriter().write("{\"message\":\"账号或密码不能为空\"}");
            return;
        }else if("admin".equals(username)&&"1234".equals(password)){
            response.getWriter().write("{\"message\":\"账号密码正确!\"}");
            return;
        }else{
            response.getWriter().write("{\"message\":\"账号或密码错误!\"}");
            return;
        }

    }