异步提交form表单

最新推荐文章于 2021-03-22 13:31:51 发布

ducode

最新推荐文章于 2021-03-22 13:31:51 发布

阅读量2.4k

点赞数

文章标签： php javascript ViewUI

原文链接：http://www.cnblogs.com/XueTing/p/10910676.html

版权

1.要使用ajaxSubmit方法，必须要加两个js文件，且顺序是：

<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/jquery-form.js"></script>

2.data的由来：

data来自于Login（servlet）中传递过来的值，如下。。。。。。。。。。所以data=1 or data=0

 @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
          req.setCharacterEncoding("utf-8");
          String id = req.getParameter("id");
          String pwd = req.getParameter("pwd");
          Dao.connect();
          boolean result = Dao.login(id,pwd);
          if(result)
          {
              resp.getWriter().print(1);
          }
          else{
              resp.getWriter().print(0);
          }
    }

3.异步提交form表单使用：

<script>
$(function(){

    /*异步提交form表单*/
    $('#button的id').click(function(){
    $('form').ajaxSubmit(function (data){
    if(data == 1)
    {
         window.location="目标地址";
    }
    else
   {
      alter('密码或账户错误');
   }

})
 
})

})

</script>

<form action="Login" method="post">
    <div class="center_center" id="center_center">
        账号：<input type="text" name="id"><br>
        密码：<input type="text" name="pwd">
    </div>
    <div class="center_buttom"><input type="button" value="登录" id="login">
    </div>
</form>

4.使用异步提交form表单的好处：

我觉得非常简便，轻巧，效率更高，可读性更好。

转载于:https://www.cnblogs.com/XueTing/p/10910676.html