课堂测试——jsp登录界面设计

最新推荐文章于 2022-07-13 11:13:03 发布

weixin_34366546

最新推荐文章于 2022-07-13 11:13:03 发布

阅读量222

点赞数

文章标签： javascript java 数据库 ViewUI

原文链接：http://www.cnblogs.com/XiaoPiHaiEr/p/6473510.html

版权

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

JSP + JDBC + MySQL

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

用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" οnsubmit="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。（努力吧！）

转载于:https://www.cnblogs.com/XiaoPiHaiEr/p/6473510.html

weixin_34366546

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
课堂测试——jsp登录界面设计

实现结果：在login.jsp页面提交用户名和密码(可以验证是否为空)，点击登录跳转到loginResult.jsp页面进行验证并显示结果JSP + JDBC + MySQLlogin.jsp设计一个表单，内容为两个输入框，一个用来输入用户名，另一个用来输入密码，并有一个提交按钮用JavaScript函数验证输入框是否都不为空<%@ page languag...
复制链接

扫一扫