实现结果:在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. centos7安装较高版本python3.5/3.6

    应用环境: Centos7或者RHEL7下默认安装的python版本为2.7.x,更新不够及时,现在很多时候需要额外安装较高版本的python环境, 网上搜罗一圈总结记录一下常用两种方式: ① 源码编 ...

  2. Java复习总结——注解

    注解 概念及作用 概念 注解即元数据,就是源代码的元数据 注解在代码中添加信息提供了一种形式化的方法,可以在后续中更方便的 使用这些数据 Annotation是一种应用于类.方法.参数.变量.构造器及 ...

  3. UVALive - 4225(贪心)

    题目链接:https://vjudge.net/contest/244167#problem/F 题目: Given any integer base b ≥ 2, it is well known ...

  4. 关于overflow-x: hidden隐藏滚动条失效的解决方案

    在苦逼写页面的时候,发现有种情况overflow-x: hidden失效了,chrome表现完好,qq浏览器有问题,微信上面展示有问题. 微信上面展示是一样能够滑动的. 如果出现类似问题的同学,请试一 ...

  5. CF1140E Palindrome-less Arrays

    我觉得这道题非常有前途....... 题意:给定一个填了一半的数组,你要把它补完,使之不存在奇回文串,求方案数.字符集为k. n,k<=20w 解:不能有长为三的回文串.也就是不能有两个相隔1的 ...

  6. Python中pandas dataframe删除一行或一列:drop函数

    用法:DataFrame.drop(labels=None,axis=0, index=None, columns=None, inplace=False) 参数说明:labels 就是要删除的行列的 ...

  7. Jmeter接口自动化

    基本思路: 在excel中维护测试用例,包括访问协议,服务器名或IP,路径,请求的方法,端口号,提交参数,测试结果等,使用CSV Data Set Config读取请求信息并写入测试结果,后期只要维护 ...

  8. Python函数的定义与调用、返回值、参数

    一.函数是什么 函数是组织好的,可重复使用的,用来实现单一,或相关联功能的代码段. 函数能提高应用的模块性,和代码的重复利用率.比如print(),len()等.但你也可以自己创建函数,这被叫做用户自 ...

  9. UI自动化学习路线

    1.web自动化 1.前端技术介绍 参考网址:http://www.w3school.com.cn/xml/xml_xsl.asp html /html5 js/jquery xml/xpath 参考 ...

  10. 将分支代码合并到master和将master代码合并到dev

    两种合并分支的方法: 都保证在合到的那个分支上面:A合并到B,即保证当前在B分支上. A merge B是把A中的改动放到B分支上,B merge A是把B中的改动merge到A中,例如把master ...