实验二实验报告

院(系)名称:网络空间安全学院
专业班级:    17软卓1班
学号:        201741404110
姓名:        李剑波
实验题目:    实验2 JSP编程
实验日期:    2019.4.18
实验(上机)学时: 2
成绩:

实验内容、要求

*改写实验1,使用H5或jsp制作一个同时兼容本地账号登录和第三方登录的登录界面。

* 使用jsp制作用户登录模块的UI界面
* 制用一个用户注册jsp页面
* 制作一个错误提示页面error.jsp。
* 制作用户中心界面。

采用的Java EE技术规范

  • JSP的基础语法
  • div+css布局
  • jquery框架

流程图

adsf

运行该项目的流程

  • http://localhost:8080/index.jsp

adsf

  • 点击登录导航按钮( 莞工登录可以登录 )

adsf

  • 点击注册导航按钮

adsf

  • 登录成功的页面( 点击莞工登录进行登录 )

adsf

  • 点击个人信息导航按钮,展示个人信息页面

adsf

1.hover头像出现修改头像按钮

adsf

2.点击修改信息按钮 adsf

3.点击绑定信息按钮 adsf

  • 点击错误页面导航按钮,错误页面展示

adsf

文件介绍

1.index.jsp 网站首页 2.login.jsp 登录页面 ```java

 登 录 



  --%>

Security Login

     账户登录 










              记住我


             登录 




     第三方登录: 




      立即注册

3.register.html 注册页面 html

 注册用户 




    body{
        background-size: 100%;
    }
    .showbtn{
        float: right;
        margin-top: -32.5px;
        padding: 6px 10px;
    }

Security Register

     注册账号 


























                 Browse 



             注册 




     已有账号,  立即登录  





$('input[id=lefile]').change(function() {
    $('#photoCover').val($(this).val());
});

4.error.jsp 错误页面 html

 哎呀~ 出错啦 

    body{
        background-size: 100%;
        background-image: url(img/error.png);
        background-repeat: no-repeat;
    }
    .button-box{
        width: 350px;
        position: absolute;
        left: 40%;
        top: 83%;
    }
    .button-box a{
        text-decoration: none;
        margin: 35px;
        color: #337ab7;
        font-size: 18px;
    }
    .button-box a:hover{
        color: #23527c;
    }




 返回首页 
 返回上一页

5.info.jsp 用户个人信息页面 java

 个人信息 









             Toggle Navigation 








              首页  
              个人信息  
              错误页面  
              标题3  
              标题4  

          isLogin = (Map ) request.getSession().getAttribute("isLogin");
        %>


              欢迎您,   
              退出  









             个人信息 setting




                 修改头像 

             Admin 






                 账户设置 


                 * 个人信息  修改  




                                 用户名: 
                                 name 
                                 Admin 


                                 邮 箱: 
                                 email 
                                 [email protected] 


                                 手机号: 
                                 phone_number 
                                 15999756885 


                                 学 院: 

                                 网络空间安全学院 


                                 类 型: 
                                 group 
                                 student 










                 * 绑定信息  绑定  



                             手机号: 
                             phone_number 
                             尚未绑定 


                             QQ号: 
                             qq 
                             尚未绑定 




                             微信号: 
                             weixin 
                             尚未绑定 


                             Github: 
                             Github 
                             尚未绑定 















$(document).ready(function(){

    //修改头像
    $("#headImg").hover(function () {
        $("#headImg").css("cursor","pointer");
        $("#headImg img").css("opacity","0.7");
        $("#headImg span").css("display","inline");
    },function () {
        $("#headImg img").css("opacity","1");
        $("#headImg span").css("display","none");
    });

    //修改个人信息
    $("#changeInfo").click(function () {
        $("#info-form").attr("action","/changeInfo");
        //隐藏修改按钮
        $("#changeInfo").hide();
        //显示 保存、取消 按钮
        $("#form-button").show();
        var input = $(".input");
        var len = input.length;
        for(var i=0;i ';
            input.eq(i).html(str);
        }
    });

    //点击取消按钮
    $(".cancel").click(function () {
        window.location.reload();
    });

    //绑定个人信息
    $("#bindInfo").click(function () {
        $("#bind-form").attr("action","/bindInfo");
        //隐藏修改按钮
        $("#bindInfo").hide();
        //显示 保存、取消 按钮
        $("#bind-button").show();
        var input = $(".bind");
        var len = input.length;
        console.log(len);
        for(var i=0;i ';
            input.eq(i).html(str);
        }
    });

});

```

drawio离线版本在线录屏zgrab2 HTTP 模块二次开发 zgrab2 入门教程 同花顺自动化下单源代码 zmap zgrab2 基础教程 投资者入市教程(股票篇)股市相关资料汇总容易记忆密码生成工具沪股股票研究创业板股票研究股票研究中心在线画URM图同花顺自动卖股票drawio优化版本在线工具列表 宝塔批量添加站长统计核心股市策略同花顺自动化买股票在线画商务图
仅提供信息存储空间服务,本网站相关内容来源互联网,如涉及侵权,请联系我们删除[email protected]