点击提交按钮后使用Ajax将用户名和密码传至后台校验，然后判断返回结果进行跳转或提示错误。

 <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

 <html>

 <head>

     <meta charset="UTF-8">

     <title>登陆页面</title>

     <link rel='stylesheet prefetch' href='login/bootstrap.min.css'>

     <link rel="stylesheet" href="login/style.css">

     <script src="jquery-3.2.1.min.js"></script>

     <script type="text/javascript">

         function sub() {

             var name = $("#name").val();

             var password = $("#password").val();

             //第二步：验证数据，这里需要从数据库调数据，我们就用到了ajax

             $.ajax({

                 url: "/usercheck",//请求地址

                 data: {name: name, password: password},//提交的数据

                 type: "POST",//提交的方式

                 dataType: "TEXT", //返回类型 TEXT字符串 JSON XML

                 success: function (data) { // 校验返回内容，进行跳转

                     //开始之前要去空格，用trim()

                     if (data.trim() == "true") {

                         window.location.href = "/welcome?name=" + name + "&password=" + password;

                     }

                     else {

                         alert("用户名或者密码错误!");

                     }

                 }

             })

         }

     </script>

 </head>

 <body>

 <div class="wrapper">

     <div class="form-signin">

         <h2 class="form-signin-heading">请登陆</h2>

         <input type="text" class="form-control" value="mike" name="name" id="name" placeholder="用户名" required=""

                autofocus=""/>

         <input type="password" class="form-control" value="123" name="password" id="password" placeholder="密码"

                required=""/>

         <label class="checkbox">

             <input type="checkbox" value="remember-me" id="rememberMe" name="rememberMe">记住我

             &nbsp;&nbsp;&nbsp;&nbsp;<a href="infoSubmit.html">注册</a>

         </label>

         <%--<button class="btn btn-lg btn-primary btn-block" id="btn">登陆</button>--%>

         <button type="submit" id="btn" class="btn btn-lg btn-primary btn-block" onclick="sub()">提交</button>

     </div>

 </div>

 </body>

 </html>

界面如下：

Ajax+JSP登陆后带参数跳转的更多相关文章

  1. 使用openURL实现程序间带参数跳转详解

    使用openURL实现程序间带参数跳转详解 实现的效果:有两款应用A与B,A打开B A --> B 1. 新建工程B,bundle ID为com.YouXianMing.B 建立一个URL 这么 ...

  2. vue-如何实现带参数跳转页面

    [前后端分离项目之vue框架经验总结] 文/朱季谦 在vue框架的前端页面上,若要实现页面之间的带参数跳转,可参考以下实现过程: 例如,点击截图中的“查看试卷”,可实现带参跳转到相应的试卷页面,该功能 ...

  3. 10.vue router 带参数跳转

    vue router 带参数跳转 发送:this.$router.push({path:'/news',query:{id:row.id}}) 接收:var id=this.$route.query. ...

  4. react-踩坑记录——Link带参数跳转后this.props为空对象

    原因,自组件在挂载时,父组件没向其传props划线部分不可缺少!!!!!!

  5. 从A页面带参数跳转到B页面；进行解析，并显示数据，进行编辑

    A页面跳转时候的地址: parent.layer.open({ type: 2, title:'新建草稿', shadeClose: true, shade: 0.8, scrollbar: fals ...

  6. 让DJANGO里的get_success_url定义的reverse_lazy带参数跳转

    按一般的CBVS实现,这个是编辑UPDATEVIEW完成之后,跳到LISTVIEW的. 但如果带跳到DETAILVIEW,则reverse_lazy需要带上参数进行跳转. 实现预定义的PK键跳转代码如 ...

  7. 外部点击链接，登陆后，直接跳转到该链接（过滤器 + Cookie实现）

    一.web.xml (1)指定过滤的Servlet类 (2)配置过滤规则,过滤以.mail结尾的链接 <?xml version="1.0" encoding="U ...

  8. Struts2 : action跳转时带参数跳转

    在实现action跳转到另一个action时,需要携带参数,可以直接在struts.xml配置文件中对应的跳转action的地方加上,参数的配置,用ognl表达式,可以从session中取值. 如果要 ...

  9. EF 在controller 带参数跳转到新的网址

    参考文章:http://blog.csdn.net/zhensoft163/article/details/7174661 我用到了这一种方式: 跳转到同一Controller 里面的不同Action ...

随机推荐

  1. JS数组的需要注意的问题

    一.在js中数组是我们经常使用的数据类型,也为我们提供了很多方法.但是有些方法需要注意使用: 1.indexOf(args):匹配一个数组中与args相等的项的索引位置,如果该数组包含这个匹配项则返回 ...

  2. 【Codeforces 111C】Petya and Spiders

    Codeforces 111 C 题意:给\(n\times m\)的网格,每个点上有一个蜘蛛,每个蜘蛛可以向上.下.左.右走一步或者不动,问最多能存在多少没有蜘蛛的点. 思路1: 首先因为\(n\) ...

  3. Luogu P2880 [USACO07JAN]平衡的阵容Balanced Lineup （ST表模板）

    传送门(ST表裸题) ST表是一种很优雅的算法,用于求静态RMQ 数组l[i][j]表示从i开始,长度为2^j的序列中的最大值 注意事项: 1.核心部分: ; (<<j) <= n; ...

  4. Saltstack学习之二：target与模块方法的运行

    对象的管理 saltstack系统中我们的管理对象叫做target,在master上我们可以采用不同的target去管理不同的minion,这些target都是通过去管理和匹配minion的id来做的 ...

  5. Android ExpandableListView和ScrollView联用的一些注意事项

    之前有整理过ScrollView嵌套ListView的例子,讲的是计算listview的每一项的高度.已达到目标效果.同样的ExpandableListView嵌套ScrollView也是这么个思路, ...

  6. Omi框架学习之旅 - 插件机制之omi-router及原理说明

    先来看看官网的介绍吧:https://github.com/AlloyTeam/omi/tree/master/plugins/omi-router 其实我推荐直接看官网的介绍.我所写的,主要给个人做 ...

  7. ${pageContext.request.contextPath}的作用【转载】

    原文地址:http://ps329795485-126-com.iteye.com/blog/1290662 刚开始不知道是怎么回事,在网上也查找了一些资料,看了还是晕. 看了另一个大侠的,终于有了点 ...

  8. JavaWeb开发中采用FreeMarker生成Excel表格

            最近做了一个需求,要求导出一个采购合同的Excel表格,这个表格样式比较多.由于是合同,这个Excel表格里面有好多格式要求,比如结尾处签字那部分就有格式要求.这里介绍种采用FreeM ...

  9. ionic访问odoo 11接口

    在架设完毕odoo 11的网站之后,第一次面临手机app该如何访问后台网站的问题,是不是模式类似asp.net mvc 那样的模式,或者还存在其他的访问方法,带着这个疑问与困惑,开始的我的研究学习之路 ...

  10. 给echarts加个“全屏展示”

    echarts的工具箱并没有提供放大/全屏的功能, 查找文档发现可自定义工具https://www.echartsjs.com/option.html#toolbox.feature show代码 t ...