个人承认...这次做的不好，粗糙，该改好的还是没改好，刷了一周多的三级，十天速成，所以也没时间改..所以会后期再改进..这学期端正态度...其实我有点想发展前端.. 言归正传
后台主要是分为两个部分，报名和管理，管理我报错了，没完成这个部分。捂脸 唉...在这里立一个flag，我会把这篇博客重新整理，代码改好的（昨天试的时候不知道为什么学号查重的代码有问题了 之前没有问题的...心烦意乱..）
前端
- 顶部的那个动画，是用的别人的js...自己还写不出来那种svg.. 主要用到的是path元素
- 栅栏必须的，响应式会方便
- 用了几个有意思的插件：像倒计时和时间轴
时间轴布局主要是左右对称的，看了一下别人的源码，感觉代码的效率很重要，因为这个地方，每个panel都有很大的共性，比如都设了透明度（为了开场动画他们是渐变的移动和渐变出现）只是布局一左一右罢了。因为框框里内容比较少，要注意单独写两个关于文字的属性，加在前边，这样这时候的页面字是左对齐和右对齐的。【不知道中间的那个树干状是咋做的..研究一下】
倒计时,一开始忘了要获取本地的时间和自己设定时间了.. 有点傻 后来师父说的时候才想起来，然后师父加的，【$j 是为了解决JQ冲突的问题，代替$用的 】 end和now的差值就是倒计时的时间，这里是随便设了一下，nowtime和endtime才是那个正确的时间
<div class="block">
<div id="countdown2" class="ClassyCountdownDemo"><span style="display:block;text-align: center;font-family: 'Consolas','Courier New', Courier, mono,serif;font-size: 30px" id="timeinfo">离报名还有：</span></div>
<script>
var $j = jQuery.noConflict();
$j(document).ready(function() {
nowtime = Math.round(new Date().getTime() / 1000).toString();
endtime = Math.round(new Date("September 10,2018 00:00:00") / 1000).toString();
$j('#countdown2').ClassyCountdown({
// end: '1001618000',
end:"1001618004",
now: "1001618000",
labels: true,
style: {
element: "",
textResponsive: .5,
days: {
gauge: {
thickness: .01,
bgColor: "rgba(0,0,0,0.05)",
fgColor: "#1abc9c"
},
textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;'
},
hours: {
gauge: {
thickness: .01,
bgColor: "rgba(0,0,0,0.05)",
fgColor: "#2980b9"
},
textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;'
},
minutes: {
gauge: {
thickness: .01,
bgColor: "rgba(0,0,0,0.05)",
fgColor: "#8e44ad"
},
textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;'
},
seconds: {
gauge: {
thickness: .01,
bgColor: "rgba(0,0,0,0.05)",
fgColor: "#f39c12"
},
textCSS: 'font-family:\'Open Sans\'; font-size:25px; font-weight:300; color:#34495e;'
}
},
onEndCallback: function() {
console.log("Time out!");
inputlist = $('form input');
$('#timeinfo').text("开始报名");
for (var i = 0; i < inputlist.length; i++) {
$(inputlist[i]).attr('disabled',false);
}
$('button[type=submit]').attr('disabled',false);
}
});
});
</script>
</div>
- 那个组别的地方，原来是想用一本书来做的，也没调的很好，被否决了... 亏我改了十个多小时...捂脸。后来就用的简单的，本来想用锚点定位啥的，给定一个最外边的框，然后overflow：hidden 这种最基础的，但是后来发现，可能每个组简介不一样长... 直接偷懒...给那个上边的li加个事件.. 去控制其他两个组的部分的display,,,发现自己现在好喜欢隐藏..太偷懒了，但是觉得这样，肯定会以后酿成问题的
display:none;
display:block;
- 气泡词云其实就是一个移动的过程
后台
盗用我恒哥的
DAO —— Data Access Object数据访问对象（接口）
DAOImpl 上面的实现类
entity —— 数据的对象
Service（不是Server）——就是中间层、逻辑层（接口）
ServiceImpl就是上面的实现类
util就是工具类的包
Servlet——JAVA WEB小应用。
写代码的时候为了清晰，简洁的分了一下层
先说一下数据处理部分
package qmx_model;
public class student {
private String st_id;
private String studentname;
private String phone;
private String sex;
public student() {
super();
}
public student(String studentname,String st_id,String phone,String sex){
this.studentname = studentname;
this.phone = phone;
this.st_id = st_id;
this.sex = sex;
}
public String getStudentname() {
return studentname;
}
public void setStudentname(String studentname) {
this.studentname = studentname;
}
public String getPhone() {
return phone;
}
public void setPhone(String phone) {
this.phone = phone;
}
public String getS_id() {
return st_id;
}
public void setS_id(String s_id) {
this.st_id = s_id;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
}
JavaBean在mvc设计模型中是model，又称模型层，也称数据层，用来设计数据的属性和行为的，提供获取属性和设置属性的get/set方法。 直观感觉就是...get/set了...
DAO部分，DAO是Data Access Object数据访问接口，数据访问：顾名思义就是与数据库打交道。夹在业务逻辑与数据库资源中间。 在核心J2EE模式中是这样介绍DAO模式的：为了建立一个健壮的J2EE应用，应该将所有对数据源的访问操作抽象封装在一个公共API中。用程序设计的语言来说，就是建立一个接口，接口中定义了此应用程序中将会用到的所有事务方法。在这个应用程序中，当需要和数据源进行交互的时候则使用这个接口，并且编写一个单独的类来实现这个接口在逻辑上对应这个特定的数据存储
所以录入信息的insert在这里了，有一个问题是王哥提到的预编译问题，当时王哥说的时候没听懂.. 后来意识到的，其实写了这个的。PreparedStatement就是预编译语句了，写这个比statement要长几句话而已，查了一下二者区别，如下：、
给我最直观的感受就是 statement写Sql语句是这样的：
String sql = "insert into examstudent" + " values("
+ student.getFlowId() + "," + student.getType() + ",'"
+ student.getIdCard() + "','" + student.getExamCard() + "','"
+ student.getStudentName() + "','" + student.getLocation()
+ "'," + student.getGrade() + ")";PreparedStatement可以传入带占位符的SQL语句，提供了补充占位符变量的方法，所以sql语句就变成了：
PreparedStatement ps=conn.preparedStatement(sql);
String sql="insert into examstudent values(?,?,?,?,?,?,?)";
使用PreparedStatement的好处：
1).提高代码的可读性和可维护性;
2).最大程度的提高性能:JDBC驱动的最佳化是基于使用的是什么功能. 选择PreparedStatement还是Statement取决于你要怎么使用它们. 对于只执行一次的SQL语句选择Statement是最好的. 相反, 如果SQL语句被多次执行选用PreparedStatement是最好的.PreparedStatement的第一次执行消耗是很高的. 它的性能体现在后面的重复执行(缓存的作用). 例如, 假设我使用Employee ID, 使用prepared的方式来执行一个针对Employee表的查询. JDBC驱动会发送一个网络请求到数据解析和优化这个查询. 而执行时会产生另一个网络请求. 在JDBC驱动中，减少网络通讯是最终的目的. 如果我的程序在运行期间只需要一次请求, 那么就使用Statement. 对于Statement, 同一个查询只会产生一次网络到数据库的通讯.当使用PreparedStatement池时, 如果一个查询很特殊, 并且不太会再次执行到, 那么可以使用Statement. 如果一个查询很少会被执行,但连接池中的Statement池可能被再次执行, 那么请使用PreparedStatement. 在不是Statement池的同样情况下, 请使用Statement.
3).可以防止SQL注入
SQL注入指的是通过构建特殊的输入作为参数传入Web应用程序，而这些输入大都是SQL语法里的一些组合，通过执行SQL语句进而执行攻击者所要的操作，其主要原因是程序没有细致地过滤用户输入的数据，致使非法数据侵入系统。
报名逻辑比较清晰简单，在Servlet里， 学号查重一下，在dao查找一下然后如果有查找到就添加到一个对象里，然后在servlet添加一个条件判断，那个对象空的就执行后面的，调用dao里的insert去添加信息到数据库，写的时候最好在各个环节把报名信息syso一下， 因为我一开始出现了一点编码问题，为了确认编码是在哪里开始有误，这样还挺容易判断的。
用户页面就是JDBC的一个增删改查，我有一个类报错了 等改好了再来总结这一部分，主要是在jsp里去做这个增删改查，所以到时候需要总结jdbc和jsp
很惭愧...捂脸
扫一扫
273
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
