6.17 实训工作记录

今日工作

今天结合昨天的工作计划，主要实现了前端登录和注册页面的跳转和传参测试，没有连接后台同学的工作，只是将页面大致功能框架框架搭建好，有待下一步连接服务器与数据库进行数据交换。

登录注册部分代码

<div id="register" class="modal fade" tabindex="-1">
	        <div class="modal-dialog">
	            <div class="modal-content">
	                <div class="modal-body">
	                    <button class="close" data-dismiss="modal">
	                        <span>&times;</span>
	                    </button>
	                </div>
	                <div class="modal-title">
	                    <h1 class="text-center">注册</h1>
	                </div>
	                <div class="modal-body">
	                    <form class="form-group" action="" id="formall">
	                        <div class="form-group">
	                            <label for="">用户名</label>
	                            <input class="form-control" type="text" placeholder="6-15位字母或数字">
	                        </div>
	                        <div class="form-group">
	                            <label for="">密码</label>
	                            <input class="form-control" type="password" placeholder="至少6位字母或数字">
	                        </div>
							<div class="form-group">
								<label for="">年级</label>
								<select class="form-control">
									<option>一年级</option>
									<option>二年级</option>
									<option>三年级</option>
									<option>四年级</option>
									<option>五年级</option>
									<option>六年级</option>
								</select>
							</div>
	                        <div class="form-group">
	                            <label for="">手机号码：</label>
	                            <input class="form-control" type="text" placeholder="请输入手机号码">
	                        </div>



							<form id="form1" action="">
								<div class="form-group">
									<label for="">邮箱</label>
									<input class="form-control" type="email" placeholder="例如:***@***.com">
								</div>
								<br>
									<input class="form-control" type="text" style="width:100px; margin-left: 80px">
									<div class="text-right">
										<button class="btn btn-primary" type="submit" style="background-color: #3a8cd2b3;border: 0px solid transparent;margin-top: -55px" onclick="submitemail();">获取验证码</button>
										<!--<button class="btn btn-primary" type="submit" style="background-color: #3a8cd2b3;border: 0px solid transparent;margin-top: -55px">获取验证码</button>-->
									</div>
							</form>


	                        <div class="text-right">
	                            <button class="btn btn-primary" type="submit" style="background-color: #3a8cd2b3;border: 0px solid transparent;" onclick="submitall()">提交</button>
	                            <button class="btn btn-danger" data-dismiss="modal" style="background-color: #fb5e5999;border: 0px solid transparent;">取消</button>
	                        </div>
	                        <a href="" data-toggle="modal" data-dismiss="modal" data-target="#login">
	                            <font style="font-size: 13px;">已有账号？点我登录</font>
	                        </a>
	                    </form>
	                </div>
	            </div>
	        </div>
        </div>
        <!--

登录部分代码

 <div id="login" class="modal fade">
	        <div class="modal-dialog">
	            <div class="modal-content">
	                <div class="modal-body">
	                    <button class="close" data-dismiss="modal">
	                        <span>&times;</span>
	                    </button>
	                </div>
	                <div class="modal-title">
	                    <h1 class="text-center">登录</h1>
	                </div>
	                <div class="modal-body">
	                    <form class="form-group" action="">
                            <div class="form-group">
                                <label for="">用户名</label>
                                <input class="form-control" type="text" placeholder="">
                            </div>
                            <div class="form-group">
                                <label for="">密码</label>
                                <input class="form-control" type="password" placeholder="">
                            </div>
                            <div class="text-right">
                                <button class="btn btn-primary" type="submit" style="background-color: #3a8cd2b3; border: 0px solid transparent;">登录</button>
                                <button class="btn btn-danger" data-dismiss="modal" style="background-color: #fb5e5999;border: 0px solid transparent;">取消</button>
                            </div>
                            <a href="" data-toggle="modal" data-dismiss="modal" data-target="#register">
                       			<font style="font-size: 13px;">还没有账号？点我注册</font>
                            </a>
	                    </form>
	                </div>
	            </div>
	        </div>
	    </div>

下一步展望

下一步需要和后台负责的同学进行交接，按照原先定义好的功能接口连接数据库，实现前端和数据库之间的参数传递，接着是主界面页面布局的设计，下一步要确定各个功能模块的使用和位置。由于确定使用bootstrap，在设计布局的同时要学习bootstrap相关知识。