一个jsp+AJAX评论系统第1/2页

这是一个简单的评论系统,使用了JDOM(这边使用Jdom-b9),实例使用JSP作为视图,结合使用AJAX(用到prototype-1.4),Servlet和JavaBean作为后台处理,使用xml文件存储数据。
1.应用目录结构如下:
data
  |--comment.xml
js
  |--prototype.js
  |--ufo.js(UTF-8格式)                                                                     
css
  |--ufo.css
images
  |--loading.gif
ufo.jsp(UTF-8格式)
WEB-INF
  |-lib
      |-jdom.jar    
  |-classes
     ...
  |-web.xml

/*********************************************
*Author:Java619
*Time:2007-02-14
**********************************************/

2.后台JavaBean  CommentBean.java

/** *//**
 * <P>外星人是否存在评论系统</p>
 * @author ceun
 * 联系作者:<br>
 *    <a href="mailto:ceun@163.com">ceun</a><br>
 * @version 1.0 2007-01-30 实现基本功能<br>
 * CommentBean.java
 * Created on Jan 30, 2007 9:39:19 AM
 */
package com.ceun.bean;

import java.io.FileWriter;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.Random;

import org.jdom.CDATA;
import org.jdom.Document;
import org.jdom.Element;
import org.jdom.JDOMException;
import org.jdom.Text;
import org.jdom.input.SAXBuilder;
import org.jdom.output.XMLOutputter;

/** *//**
 *<p> 封装对XML的操作</p>
 * @author ceun
 * 联系作者:<br>
 *    <a href="mailto:ceun@163.com">ceun</a><br>
 * @version 1.0 2007-01-30 实现基本功能<br>
 */
public class CommentBean ...{
    private String filepath;

private SAXBuilder builder = null;

private Document doc = null;

public CommentBean() ...{

}
/** *//**
 * 初始化XML文件路径,加载文件
 * */
    public CommentBean(String path) ...{
        this.filepath = path;
        builder = new SAXBuilder();
        try ...{
            doc = builder.build(filepath);
        } catch (JDOMException e) ...{
            System.out.print("找不到指定的XML文件");
            e.printStackTrace();
        } catch (IOException e) ...{
            System.out.print("找不到指定的文件");
            e.printStackTrace();
        }
    }
 /** *//**
  * 添加评论
  * @param nikename 评论者昵称
  * @param comment 评论内容
  * @param attitude 评论者的结论(yes-存在,no-不存在)
  * */
    public String addComment(String nikename, String comment, String attitude) ...{
        Element root = doc.getRootElement();

Element el = new Element("comment");
        Random rand = new Random();
        int id = rand.nextInt(10000);
        el.setAttribute("id", "comment_" + id);
        el.setAttribute("attitude", attitude);

Element name = new Element("nikename");
        CDATA cname = new CDATA(nikename);
        name.addContent(cname);

Element data = new Element("data");
        CDATA ctext = new CDATA(comment);
        data.addContent(ctext);

SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        Date date = new Date();
        Text tdate = new Text(format.format(date));
        Element pubdate = new Element("pubdate");
        pubdate.addContent(tdate);

el.addContent(name);
        el.addContent(data);
        el.addContent(pubdate);
        root.addContent(el);
        XMLOutputter outputter = new XMLOutputter("  ", true, "GB2312");
        // 清除comment元素间的空格
        outputter.setTrimAllWhite(true);
        try ...{
            outputter.output(doc, new FileWriter(filepath));
        } catch (IOException e) ...{
            System.out.println("指定路径有错");
            e.printStackTrace();
        }
        return tdate.getText();
    }
/** *//**
 * 删除指定ID的评论
 * @param commentId 评论ID
 * @return 返回操作结果字符串(成功或失败)
 * */
    public String removeComment(String commentId) ...{
        Element root = doc.getRootElement();
        List comments = root.getChildren();
        int size = comments.size();
        Element dist = null;
        for (int i = 0; i < size; i++) ...{
            Element comment = (Element) comments.get(i);
            String id = comment.getAttributeValue("id");
            if (id.equals(commentId)) ...{
                dist = comment;
                break;
            }
        }
        if (dist != null) ...{
            root.removeContent(dist);
            XMLOutputter outputter = new XMLOutputter("  ", true, "GB2312");
            // 清除comment元素间的空格
            outputter.setTrimAllWhite(true);
            try ...{
                outputter.output(doc, new FileWriter(filepath));
            } catch (IOException e) ...{
                System.out.println("重写文件有出错");
                e.printStackTrace();
            }
            return "成功删除指定元素!";
        } else
            return "指定元素不存在!";
    }
/** *//**
 * 批量删除评论
 * @param commentIdArgs 评论ID数组
 * @return 返回操作结果字符串(成功或失败)
 * */
    public String removeComments(String[] commentIdArgs) ...{
        Element root = doc.getRootElement();
        List comments = root.getChildren();
        int size = comments.size();
        int len = commentIdArgs.length;
        List<Element> dist = new ArrayList<Element>();
        outer:for (int i = 0; i < size; i++) ...{
            Element comment = (Element) comments.get(i);
            String id = comment.getAttributeValue("id");

for (int j = 0; j < len; j++)
                if (id.equals(commentIdArgs[j])) ...{
                    dist.add(comment);
                    continue outer;
                }
        }
        int dist_size=dist.size();
        if (dist_size != 0) ...{
            for (int i = 0; i < dist_size; i++)
                root.removeContent(dist.get(i));
            XMLOutputter outputter = new XMLOutputter("  ", true, "GB2312");
            // 清除comment元素间的空格
            outputter.setTrimAllWhite(true);
            try ...{
                outputter.output(doc, new FileWriter(filepath));
            } catch (IOException e) ...{
                System.out.println("重写文件有出错");
                e.printStackTrace();
            }
            return "成功删除指定的元素集合!";
        } else
            return "指定元素集合的不存在!";
    }

/** *//**
     * @return the filepath
     */
    public String getFilepath() ...{
        return filepath;
    }

/** *//**
     * @param filepath
     *            the filepath to set
     */
    public void setFilepath(String filepath) ...{
        this.filepath = filepath;
    }

/** *//**
     * @return the builder
     */
    public SAXBuilder getBuilder() ...{
        return builder;
    }

/** *//**
     * @param builder
     *            the builder to set
     */
    public void setBuilder(SAXBuilder builder) ...{
        this.builder = builder;
    }
}

3.处理AJAX请求的Servlet  AddCommentServlet.java

package com.ceun.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.ceun.bean.CommentBean;
/** *//**
 * <p>后台处理Servlet</p>
 *2007-01-30
 * * @author ceun
 * 联系作者:<br>
 *    <a href="mailto:ceun@163.com">ceun</a><br>
 * @version 1.0 2007-01-30 实现基本功能<br>
 * */
public class AddCommentServlet extends HttpServlet ...{

/** *//**
     * serialVersionUID long
     */
    private static final long serialVersionUID = 1L;

/** *//**
     * The doGet method of the servlet. <br>
     * 
     * This method is called when a form has its tag value method equals to get.
     * 
     * @param request
     *            the request send by the client to the server
     * @param response
     *            the response send by the server to the client
     * @throws ServletException
     *             if an error occurred
     * @throws IOException
     *             if an error occurred
     */
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException ...{
        request.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charset=UTF-8");
        response.setHeader("Cache-Control", "no-cache");

PrintWriter out = response.getWriter();
        String nikename = request.getParameter("nn");

String comment = request.getParameter("rsn");
        String attitude = request.getParameter("atti");
        String filepath = request.getSession().getServletContext().getRealPath(
                "data/comment.xml");
        CommentBean bean = new CommentBean(filepath);
        String str = bean.addComment(nikename, comment, attitude);
        out.println(str);
    }

/** *//**
     * The doPost method of the servlet. <br>
     * 
     * This method is called when a form has its tag value method equals to
     * post.
     * 
     * @param request
     *            the request send by the client to the server
     * @param response
     *            the response send by the server to the client
     * @throws ServletException
     *             if an error occurred
     * @throws IOException
     *             if an error occurred
     */
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException ...{

doGet(request, response);
    }

}

当前1/2页 12下一页阅读全文

(0)

相关推荐

  • Vue.js实现文章评论和回复评论功能

    本来想把这个页面用jade渲染出来.评论部分用vue,但是想了想觉得麻烦,最后还是整个用vue的组件搞定他吧. 先上在线demo:http://jsbin.com/ceqifo/1/edit?js,output 再上效果图 可直接评论,点击别人的评论能回复别人的评论. html <div id="comment"> <article-content v-bind:article="article"></article-content&g

  • JS扩展Z-Blog图片验证码的单击自动刷新与评论内容自动保存

    在script/common.js最后加入下面的话可以实现图片验证码的自动刷新与评论内容自动保存(ForIE) 由于Z-Blog的JS扩展机制不够好,在不重建的情况下扩展东西只能用window.onload(IE). 既然用了window.onload,那就干脆用window.clipboardData了. 大家是不是期盼这两个功能很久了?没有了Ajax的,这两个功能就太重要太重要太重要了. 实际这个函数因为先天缺陷并不完美,下一版,构想在每一页下面加上一句话读一次LoadExtraScript

  • Json实现异步请求提交评论无需跳转其他页面

    主要将代码粘贴,通过阅读代码理解其中的相关逻辑. html代码: <form id="form1" runat="server"> <p> 评论:</p> <p> 姓名:<input type="text" name="username" id="username1" /></p> <p> 内容:<textarea n

  • js写的评论分页(还不错)

    复制代码 代码如下: <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServer

  • js实现简单的星级选择器提交效果适用于评论等

    星级选择器,提交代码适用于评论等 没有用到js库,就是单独的js代码   复制代码 代码如下: <form action="" method="get"> <div id="star_level" star_width="14"> <p>服务</p> <ul class="star_rating"> <li style="displ

  • 使用AngularJS和PHP的Laravel实现单页评论的方法

    完整代码:https://github.com/scotch-io/laravel-angular-comment-app 目前,Laravel和Angular均已经成为了Web发展世界里非常著名的工具.Laravel以给PHP社区引入的伟大内容著称,Angular以其惊人的前端工具及简单著称.组合这两大框架似乎是合乎逻辑的下一步. 在我们的使用环境下,我们将使用Laravel作为后端的RESTful API,Angular作为前端,以创建一个简单的单页的评论应用. 下面是一个简单的例子,展示了

  • JS类定义原型方法的两种实现的区别评论很多

    我们知道,给JavaScript类添加原形(prototype)方法是很简单的.而且常用的有下面这两种方法,可是这两种方法在使用时有区别吗?     JScript Class:  复制代码 代码如下: function JSClass()   {        } Extends prototype method:  复制代码 代码如下: JSClass.prototype.MethodA = function()   { }; Or   复制代码 代码如下: function = JSCla

  • vue.js实现用户评论、登录、注册、及修改信息功能

    vue.js实现用户评论.登录.注册.及修改用户部分信息功能代码.效果图如下: 登入后: 登入前: 登录框: 注册框: html代码部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>index</title> <link rel="stylesheet" href=&quo

  • 原生js实现回复评论功能

    实现原理 功能1.删除状态 用removeChild()方法即可 功能2.最上面的点赞 判断文字的内容是否为赞,做相应操作改变存放赞数量的容器文本内容 功能3.回复评论 创建一个新的评论添加到评论列表里 功能4.回复里的点赞 判断我是否点了赞,做相应操作 功能5.回复或者删除 判断字符串回复还是删除,做相应操作 代码用了事件代理,还有三元运算判断,减少代码量 每行代码都有详细的注释 一眼看到那么多的代码不要烦躁 其实你要把每个功能单独去看都是很简单的dom操作 一点点消化,读懂每一行代码 完整代

  • JavaScript实现QQ聊天消息展示和评论提交功能

    QQ聊天消息显示,提交评论等实现原理,具体内容如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } .bos { margin: 100px auto; width: 350px; posi

随机推荐