BBS论坛详细设计文档

[前言：]

在2011年10月28日, 16:24:15 我开始开发BBS论坛。开始时准备了很多所需的图片素材。项目是2012-02-13完成的。记下这个开发中学到的东西。

[正文：]

    系统分为前台功能和后台管理。

[代码分析：]

首页index.jsp 。下图是首页的组成图：

页面头上的欢迎信息和页面底部的开发商信息在前台每个网页上都是一样的。所以后面不再介绍了。后面基本页面发生改都是在中间部分发生变化。

首页欢迎，使用JavaScript获取当前的时间，且每200ms更新一次。

JavaScript代码如下：

在网页加载时就执行该JavaScript函数

用户登入是典型的Sturct2 的应用。

用户登入信息请求通过表单发送的dologin.action。dologin.action。根据struts.xml配置文件跳转页面。

请求如下：

                                maxlength="20" />

                                maxlength="20" />

提交

重置

dologin.action。如下：

struts.xml配置如下：

这是使用struts2最基本也是最经典的方式。后面的差不多是这种。

在写Index.jsp页面的时候还学到2点，

1 学会了使用标签。

2 学会了如何从Struct栈中取值。怎么取的session中的值：

代码如下：

        <%@include file="top.jsp"%>   

        <%@include file="top2.jsp"%>  

3：自定义标签

  发现了自定义标签的好处，使用自定义标签，可以很多需要在JSP 页面写的代码都在标签文件中写好，这样就很好的把代码和标签分离。我想这也是struts2定义那么多标签的原因吧。

自定义标签的方法如下：

DisplayTag.java标签文件

app.tld 标签配置文件

    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd"

    version="2.0">

    A tag library exercising SimpleTag handlers.

    1.0

    SimpleTagBBS

    http://www.bbs.cn

      display

      com.ssoft.bbs.tag.DisplayTag

    empty

  displayCount

  com.ssoft.bbs.tag.DisplayCount

    empty

在web.xml文件中配置

      http://www.bbs.cn 

        /WEB-INF/app.tld    

用户注册register.jsp模式和index.jsp类似

        list="{'男','女'}" value="%{'男'}" />

不过在这里使用了 和标签

list="头像头像头像头像头像头像头像头像头像头像头像头像头像头像头像头像头像头像头像18'}

required="true" headerKey="0" value=    

onchange="showlogo();" />

发帖：newtopic.jsp使用的还是Sturct2的经典模式，不再重复。

使用JavaScript改变字体的颜色，字体等。自己写的JavaScript文件

function change_B(){

    var text = $("#text");

    var v = text.val();

    if (v != "") {

        text.css({

            "font-weight": "bold"

        });

    }

    document.getElementsByName("rp.xq").getAttribute("");

}

…………………

回帖：response.jsp

浏览帖子的回复和回帖显示在一个页面上。使用标签组合成一个页面。

基本实现在当前页回复的显示，在当前的帖子能显示。

使用了Struct+json+AJAX。

使用AJAX的异步交互，使用JSON显示返回的数据。

DoResponse.jsp处理请求的代码如下：

public class ResponseAction extends ActionSupport {

    /**

     * 

     */

    private static final long serialVersionUID = -26939651812392198L;

    private Response rp = new Response();

    private String result;

    public Response getRp() {

        return rp;

    }

    public void setRp(Response rp) {

        this.rp = rp;

    }

    public String getResult() {

        return result;

    }

    public void setResult(String result) {

        this.result = result;

    }

    public String execute() {

        ResponseDao responsedao = new ResponseDao();

        LoginDao logindao = new LoginDao();

        String name = (String) ActionContext.getContext().getSession().get(

                "name");

        rp.setAuthor(name);

        responsedao.InsertResponseRecord(rp);

        Login user = null;

        user = logindao.getRecordForUser(name);

     Map map = new HashMap();

        map.put("content", rp.getContent());

        map.put("xq", rp.getXq());

        map.put("author", rp.getAuthor());

        map.put("submittime", Time.getCurrentTime());

        if (name == null) {

            map.put("email", "");

            map.put("tx", );

            map.put("qq", "");

        } else {

            map.put("email", user.getEmail());

            map.put("tx", user.getTx());

            map.put("qq", user.getOicq());

        }

        JSONObject jo = JSONObject.fromObject(map);

        result = jo.toString();

        return SUCCESS;

    }

AJAX的JavaScript函数如下：

function subm(){   //提交请求

    var title=$("#title").val();

    var xq=getRadioBoxValue("xq");  //获取单选按钮的值

    var content=$("#text").val();

    var  topicname=$("#topicname").val();

    var topicid=$("#topicid").val();

    $.post('doResponse.action',{"rp.title":title,"rp.xq":xq,"rp.content":content,"rp.topicname":topicname,"rp.topicid":topicid},

            function(data){

        var rs =eval(data);    //包数据解析为json 格式  

        var rp2=rs.result;

        var rp=eval("(" + rp2+ ")")  //把数据解析为 JSON 格式

        $('#02').append(

                ""+

                +

                    "

                        "

                            "

                            "

                            "

                        "

                            "

                        "

                            "

                            "

        }, 'json');

}

function   getRadioBoxValue(radioName)  

{  

          var obj = document.getElementsByName(radioName);             //这个是以标签的name来取控件 

               for(i = 0; i < obj.length; i++) {

                if(obj[i].checked)    {  

                        return   obj[i].value;  

                }  

            }          

           return "undefined";        

}

                result

struct.xml中的配置如下：

后台管理adminindex.jsp

使用HTML的frameset。组成管理页面。这是一种比较常用的方式。左边框架显示功能，右边框架显示主要内容。但是存在一个很大的问题。Struct2的 struct.xml 不支持HTMl的框架。页面请求的信息如果直接跳转Frameset 的框架页面 里面的子页面接收不到参数 ，

如果直接跳转到子页面 页面就没有那个效果 ，如何解决这个问题呢？看了网上不少解决方法，发现只有一种解决方法，就是把需要传送的变量存在Session里面。

个人觉得存在把值存在session中是一种非常浪费服务器资源的。特别如果要显示的数据是批量的数据，是ArrayList，更是非常浪费资源。而且ArrayList也不能存在cookie 里面。

所以在这时我放弃了Struct2很多遍历。

栏目管理：main.jsp

因为main.jsp的版块少。所以这里我没有做分页处理。

但是这样也有一个亮点——点击弹出对话框。基本实现原理是，在页面载入的是时候将某层影藏，在点击某按钮或超链接触发事件的时候显示。主要通过CSS+div+JavaScript

 div 源码如下：初始时隐藏状态。

             新增论坛