新SSH开发

1 详细步骤

1.1 创建相关界面(提前准备好相关图片素材)

1.1.1把相关素材拷贝到WebRoot目录下

1.1.2 先编写首页面、注册界面、主界面三个页面

1.2 建立数据库

建表（http://pan.baidu.com/s/1hsNzPxq）、导入数据（http://blog.csdn.net/piaolankeke/article/details/6272214）

load data local infile 'D:\\data.txt' into table 表名 fields terminated by '\t';

1.3 整合SSH

1.3.1 引入spring包

1.3.2 在src目录下开发一个beans.xml文件（spring容器）

beans.xml重配置：

<bean id="testService" class="com.xiaonei.test.TestService"><property name="name"><value>"jiaozl"</value></property></bean>

在Main中验证引入是否成功（省略新建类TestService）

ApplicationContext ac = new  ClassPathXmlApplicationContext("beans.xml");TestService ts = (TestService) ac.getBean("testService");System.out.print(ts.getName());

1.3.3 整合Hibernate

使用MyEclipse的逆向工程(关系模型--->对象模型)

1.3.3.1数据库浏览器先连接到MySQL数据库

http://blog.csdn.net/u013943420/article/details/70941252#t0

1.3.3.2 导入Hibernate开发包

需要使用MyEclipse工具导入包，否则无法使用逆向工程。

1.3.3.3 把Hibernate包替换成我们自己的包

1.3.3.4 使用逆向工程，把表映射成domain对象

1.3.4 整合struts

如果希望使用MyEclipse提供的structs设计工具，需要通过MyEclipse导入struts，然后升级struts包（删除MyEclipse引入的struts包，重新加入）

1.3.5 编写测试程序

test.jsp->TestAction->showCounty.jsp

1.3.6 把struts（action）交给spring管理

至此，SSH整合完毕

1.4 注册

1.4.1 register中添加，大学信息浮动显示框

<!-- 准备显示的大学表格 start --><div class="divSch" id="uniDiv"style="display: block; position: absolute; top: 50px; left: 750px"><table border="1" align="center" height="380px" width="500px"bordercolor="#3B5888"><!-- 显示所有国家 --><tr><td bordercolor="#C3C3C3" width="500px"><c:forEach  var="country" items="${countrylist}"><a id="${country.id }" onclick="setCoUnis(this)" class="xh"href="javascript:void(0);">${country.name }</a> |</c:forEach></td></tr><!-- 显示当前国家的所有直辖市和省份 --><tr><td bordercolor="#C3C3C3"><div id="proTbl"><table width="100%"><tr><td><c:forEach var="province" items="${provincelist}"><a onclick='setProUnis(this)' href="javascript:void(0);"class="xh" id="${province.id}" coId="${province.country.id }">${province.name } </a></c:forEach></td></tr></table></div></tr><!-- 显示当前省或者直辖市的大学 --><tr><td valign="top" bordercolor="#C3C3C3"><div style="width: 550px; height: 280px; overflow: auto"id="uniTbl"><table width="100%"><tr><c:forEach var="university" items="${unilist}" varStatus="vs"><td><li><a onclick='showMyUni(this)' href="javascript:void(0);"class="xh"  id="${university.id }">${university.name }</a></li></td><c:if test="${vs.count%3==0}"></tr><tr></c:if></c:forEach></tr></table></div></td></tr><tr><td align="right" bordercolor="#FFFFFF"><input type="button" value="关闭窗口" onclick="closeUniTbl()"style="color: white; background-color: #3B5888; padding: 3px;" /><br /><br /><br /><br /></td></tr></table></div><!-- 准备显示的大学表格 end -->

1.4.2 用来处理大学的ajax代码（运行在客户端，发送异步请求并处理1.4.3 servlet返回的xml数据）

// ajax引擎var xmlrequest;function createXMLHttpRequest() {// 根据不同的浏览器创建一个ajax引擎if (window.ActiveXObject) {xmlrequest = new ActiveXObject("Microsoft.XMLHTTP");} else {xmlrequest = new XMLHttpRequest();}}function setCoUnis(o) {createXMLHttpRequest();if (xmlrequest) {//准备发送请求//window.alert(o.id);var req = "serShowCoUnis?coId=" + o.id;//打开请求xmlrequest.open("get", req, true);//指定处理结果的函数xmlrequest.onreadystatechange = getCoUnis;//发送请求xmlrequest.send(req);}}function getCoUnis() {if (xmlrequest.readyState == 4) {if (xmlrequest.status == 200) {var pros = xmlrequest.responseXML.getElementsByTagName("province");var con = "<table width='100%'><tr>";//window.alert(pros.length);if(pros.length>0){for (var i = 1; i <= pros.length; i++) {con += "<td><a onclick='setProUnis(this)' href='javascript:void(0);' id='" + pros[i - 1].childNodes[0].childNodes[0].data + "' coId='" + pros[i - 1].childNodes[2].childNodes[0].data + "' class='xh'>" + pros[i - 1].childNodes[1].childNodes[0].data + "</a></td>";if (i % 15 == 0) {con += "</tr><tr>";}}con += "</tr></table>";}else{con = " ";}document.getElementById("proTbl").innerHTML = con;var unis = xmlrequest.responseXML.getElementsByTagName("unis");var con2 = "<table width='100%'><tr>";for (var i = 1; i <= unis.length; i++) {con2 += "<td><li><a onclick='showMyUni(this)' href='javascript:void(0);' id='" + unis[i - 1].childNodes[0].childNodes[0].data + "' class='xh'>" + unis[i - 1].childNodes[1].childNodes[0].data + "</a></li></td>";if (i % 3 == 0) {con2 += "</tr><tr>";}}con2 += "</tr></table>";document.getElementById("uniTbl").innerHTML = con2;}}}//响应用户点击省市function setProUnis(o) {createXMLHttpRequest();if (xmlrequest) {//准备发送请求var req = "/xiaonei/ChangeInfo?proid="+o.id+"&cid="+o.getAttribute("coId");//window.alert(req);//打开请求xmlrequest.open("get", req, true);//指定处理结果的函数----回调函数xmlrequest.onreadystatechange = getProUnis;//发送请求---get方式请求，没有发送的数据，所以send可以不写或写nullxmlrequest.send();}}function getProUnis() {//完成  状态码if (xmlrequest.readyState == 4) {//成功返回!if (xmlrequest.status == 200) {//表示获取unis,并拼接成一个新的大学表格var unis = xmlrequest.responseXML.getElementsByTagName("unis");var con = "<table width='100%'><tr>";for (var i = 1; i <= unis.length; i++) {con += "<td><li><a onclick='showMyUni(this)' href='javascript:void(0);' id='" + unis[i - 1].childNodes[0].childNodes[0].data + "' class='xh'>" + unis[i - 1].childNodes[1].childNodes[0].data + "</a></li></td>";if (i % 3 == 0) {con += "</tr><tr>";}}con += "</tr></table>";//替换成最新的表格document.getElementById("uniTbl").innerHTML = con;}}}function showMyUni(o) {//取出被点击的大学的名称.o.innerHTML//document.getElementById("university").value=o.innerHTML;$("#university").val(o.innerHTML);//把选择大学的框框关闭//document.getElementById("uniDiv").style.display="none";$("#uniDiv").css("display","none");//document.getElementById("uuniversity").value=o.id;$("#uuniversity").val(o.id);}function showUniTbl() {//document.getElementById("uniDiv").style.display = "";$('#uniDiv').show();}function closeUniTbl() {//document.all.uniDiv.style.display = "none";document.getElementById("uniDiv").style.display = "none";}

1.4.3 处理请求的servlet

public class ChangeInfo extends HttpServlet {public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {response.setContentType("text/xml;charset=utf-8");// 让IE禁用缓存response.setHeader("Cache-Control", "no-cache");PrintWriter out = response.getWriter();String proid = request.getParameter("proid");String cid = request.getParameter("cid");//获取spring容器WebApplicationContext ctx = WebApplicationContextUtils.getWebApplicationContext(this.getServletContext());//从spring容器中，取出了 UniversityServiceInter 类型的beanUniversityServiceInter universityService=(UniversityServiceInter) ctx.getBean("universityService");List<University> uniList=universityService.getResult("from University where province.id=? and country.id=?", new Object[]{Integer.valueOf(proid),Integer.valueOf(cid)});// 返回结果为xml数据String res = "<allUniversities>";for (int i = 0; i < uniList.size(); i++) {University u = uniList.get(i);// <![CDATA[var]]>  var使用这个包裹，可以解决乱码问题（多国语言显示等）res += "<unis><id>" + u.getId() + "</id><name><![CDATA["+ u.getName() + "]]></name></unis>";}res += "</allUniversities>";out.write(res);out.close();}public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {this.doGet(request, response);}}

1.5 用户登录

1.6 上传头像

1.6.1 首先改变数据库表photo字段

1.6.2 把该用户的头像上传到服务器

表单form中，获取文件，需要声明为formfile类型

1.7 相册管理功能