实现结果：在login.jsp页面提交用户名和密码(可以验证是否为空)，点击登录跳转到loginResult.jsp页面进行验证并显示结果

JSP + JDBC + MySQL

login.jsp

设计一个表单，内容为两个输入框，一个用来输入用户名，另一个用来输入密码，并有一个提交按钮

用JavaScript函数验证输入框是否都不为空

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

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script type="text/javascript">

    function $(id) {

        return document.getElementById(id);

    }

    function check() {

        var user = $("user").value;

        var pwd = $("pwd").value;

        $("userInfo").innerHTML="";

        $("pwdInfo").innerHTML="";

        if(user == "") {

            $("userInfo").innerHTML="用户名不能为空！";

            $("user").focus();

            return false;

        }

        if(pwd == "") {

            $("pwdInfo").innerHTML="密码不能为空！";

            $("pwd").focus();

            return false;

        }

        return true;

    }

</script>

<style type="text/css">

    #userInfo{color:red;}

    #pwdInfo{color:red;}

</style>

<title>登录</title>

</head>

<body>

    <center>

        <form action="loginResult.jsp" method="post" onsubmit="return check()">

            <br><br><br><br><br><br>

            <table>

                <tr><td>用户名：</td><td><input type="text" name="userName" id="user"><span id="userInfo" ></span></td></tr>

                <tr><td>密码：</td><td><input type="password" name="userPwd" id="pwd"><span id="pwdInfo"></span></td></tr>

                <tr><td></td><td><input type="submit" value="登     录"></td>

            </table>

        </form>

    </center>

</body>

</html>

　　

　　课堂测试未按时完成原因：假期未合理分配时间在该科目上导致未按时完成实现预期。

　　希望通过该课上可以开发简单有趣的小程序（app）。预计每周在该课程上花费8h。（努力吧！）

　　

课堂测试——jsp登录界面设计的更多相关文章

  1. Python图形编程探索系列-07-程序登录界面设计

    设计任务 初步设计程序登录界面,详细分析设计步骤. 程序详细分析 基本框架设计 import tkinter as tk import tkinter.messagebox root = tk.Tk( ...

  2. 第四篇——Spring音乐登录界面设计及实现(C#)

    Spring音乐播放器,我们小组设计其启动时有一个登录界面,用户初次可以注册,输入用户名和密码,点击注册即将输入信息保存到register文本文件中:如果已有用户名,输入用户名和密码,点击登录,程序会 ...

  3. Qt常用的登录界面设计

    记录一下Qt常用的登录界面的设计 方便以后使用! 1.QpushButton改变一个按钮的颜色,当鼠标放上去和移开时显示不同的颜色.QPushButton { background-color: rg ...

  4. tkinter+pickle+python的一个登录界面设计

    1.代码: #导出模块 import tkinter as tk from tkinter import messagebox import pickle #定义登录的窗口.标题.大小和位置 wind ...

  5. Bootstrap风格登录界面设计样例

    参考:http://bootsnipp.com/tags/login Register Page   127.8K 187 Modal Login with jQuery Effects   159. ...

  6. 用jsp实现网站登录界面的制作，并连接数据库

    课堂测试 任务需求: 撰写一篇博客 需要网站系统开发需要掌握的技术: 本次课堂测试的源程序代码: 运行结果截图: 说明课堂测试未按时完成的原因. 列出你对这门课的希望和自己的目标,并具体列出你计划每周 ...

  7. 课堂测试_WEB界面链接数据库

    课堂测试_WEB界面链接数据库 一,题目: 一. 考试要求: 1登录账号:要求由6到12位字母.数字.下划线组成,只有字母可以开头:(1分) 2登录密码:要求显示“• ”或“*”表示输入位数,密码要求 ...

  8. 初识Jsp，JavaBean,Servlet以及一个简单mvc模式的登录界面

    1:JSP JSP的基本语法:指令标识page,include,taglib;page指令标识常用的属性包含Language用来定义要使用的脚本语言:contentType定义JSP字符的编码和页面响 ...

  9. 仿知乎app登录界面(Material Design设计框架拿来就用的TexnInputLayout)

    在我脑子里还没有Material Design这种概念,就我个人而言,PC端应用扁平化设计必须成为首选,手当其冲的两款即时通讯旺旺和QQ早就完成UI扁平化的更新,然而客户端扁平化的设计本身就存在天生的 ...

随机推荐

  1. Cannot set property 'innerHTML' of null

    异常处理汇总-前端系列 http://www.cnblogs.com/dunitian/p/4523015.html 看如下错误代码: 知道是加载的问题就好解决了

  2. redis 指令文档

    参考:https://redis.io/commands http://www.runoob.com/redis/redis-lists.html redis: 打开一个 cmd 窗口 使用cd命令切 ...

  3. Linux下学习摄像头使用

    刚接触Linux硬件驱动有关的项目,配置摄像头经历的一些操作 (这篇文章是刚接触Linux下V4L时作为记录记下的,感觉只有几个命令还有参考作用) 一 确定摄像头种类 确定是否符合UVC标准协议,一般 ...

  4. appium 切换native/ webview，findby，还有页面元素定位一直小于0的问题的解决

    之前一直有个bug没有解决. 今天,终于解决了. 疑问过程: app是混合应用,项目做了H5优化之后,以前的用例执行总会失败,体现在原来的一个元素点击无反馈 排查原因:1.项目做了H5优化,2.测试的 ...

  5. WPF开发的界面调用C++生成的dll文件

    以引用d1.dll为例. [生成d1.dll] 文件——新建——项目——Visual C++——Win32项目,选择DLL,点击Finish.在d1.cpp中添加代码 #include "s ...

  6. Flask简单学习

    一:安装 直接 pip install Flask,就可以安装好了 二:hello world 编写一个hello.py # coding: utf- from flask import Flask ...

  7. 微服务框架之微软Service Fabric

    常见的微服务架构用到的软件&组件: docker(成熟应用) spring boot % spring cloud(技术趋势) Service Fabric(属于后起之秀 背后是微软云的驱动) ...

  8. opencv源码学习: getGaussianKernel( 高斯核）；

    参考: https://blog.csdn.net/u012633319/article/details/80921023 二维高斯核, 可以根据下面的公式推到为两个一维高斯核的乘积: 原型: /** ...

  9. 选择排序Java版

    package dataStructureAlgorithmReview.day01; import java.util.Arrays; /** * * @author shundong * */ p ...

  10. HTML常用提交按钮

    1. 标签=元素 disabled(不可操作)  readonly(只读)  placeholder(提示文本) autofocus(自动获焦)  autocomplete=”on(默认.规定启用自动 ...