新闻作业2——评论功能的实现

        在开始完成这个功能之前,讲讲目前的缺陷,首先我没有评论表中添加主键,这样直接与每条新闻的评论功能无法全部实现,想要完成这个功能比较啰嗦,只需要把新闻表的主键绑定为评论表的外键。写到后期才发现这个问题,因此我只完成了一条新闻(news_read.jsp)的评论功能。此外,如果你的数据库没有评论表,第一次加载新闻页面会报错,如果你有好的建议请评论留言


第一步:我们需要创建评论类,在news.entity包中创建bm_comment类,加入如下代码

package com.jjzd.news.entity;
//TODO:本页为benmao编写

public class bm_comment {
	private String username;
	private String ip;
	private String comment;
	
	public bm_comment() {
		
	}
	
	public bm_comment(String username, String ip, String comment) {
		super();
		this.username = username;
		this.ip = ip;
		this.comment = comment;
	}

	public String getUsername() {
		return username;
	}

	public void setUsername(String username) {
		this.username = username;
	}

	public String getIp() {
		return ip;
	}

	public void setIp(String ip) {
		this.ip = ip;
	}

	public String getComment() {
		return comment;
	}

	public void setComment(String comment) {
		this.comment = comment;
	}

	@Override
	public String toString() {
		return "bm_comment [username=" + username + ", ip=" + ip + ", comment=" + comment + "]";
	}
	
}

第二步:我们需要预写功能,在news.dao包中创建bm_comment接口,注意是接口,加入如下代码

import java.util.List;;

//TODO:本页为benmao编写

public interface bm_comment {
	
	//是否存在评论表
	public boolean isComExist();
	
	//创建评论表(username,ip,comment)
	public int createCom();
	
	//获取所有评论
	public List<com.jjzd.news.entity.bm_comment> getallCom();
	
	//添加评论
	public int addCom(String id, String name, String content);
}

说明:com.jjzd.news.entity.bm_comment 全名是避免导包冲突

第三步:现在需要写具体的方法,在news.dao.impl包中创建bm_comment实现类,依次加入方法

实现类需要先继承BaseDao.java再实现父接口

        方法1:是否存在评论表 

@Override
	// 是否存在评论表
	public boolean isComExist() {
	    String sql = "select * from com limit 1";
	    Connection con = null;
	    PreparedStatement ps = null;
	    ResultSet rs = null;
	    try {
	        con = getConnection();
	        ps = con.prepareStatement(sql);
	        rs = ps.executeQuery();
	        if (rs!=null) {
	        	System.out.println("true");
	            return true; // 表存在
	        } else {
	        	System.out.println("false");
	            return false; // 表不存在
	        }
	    } catch (SQLException e) {
	        e.printStackTrace();
	        System.out.println("异常");
	        return false; // 出现异常,表不存在
	    } finally {
	        // 关闭资源
	        try {
	            if (rs != null) {
	                rs.close();
	            }
	            if (ps != null) {
	                ps.close();
	            }
	            if (con != null) {
	                con.close();
	            }
	        } catch (SQLException e) {
	            e.printStackTrace();
	        }
	    }
	}

        方法2: 创建评论表

@Override
	//创建评论表(username,ip,comment)
	public int createCom() {
	    String createTableSql = "create table com (id VARCHAR(50), name VARCHAR(50), content VARCHAR(255))";
	    Connection con = null;
	    PreparedStatement ps = null;
	    try {
	        con = getConnection();
	        ps = con.prepareStatement(createTableSql);
	        return ps.executeUpdate();
	    } catch (SQLException e) {
	        e.printStackTrace();
	        return 0;
	    } finally {
	        // 关闭资源
	        try {
	            if (ps != null) {
	                ps.close();
	            }
	            if (con != null) {
	                con.close();
	            }
	        } catch (SQLException e) {
	            e.printStackTrace();
	        }
	    }
	}

        方法3:获取所有评论

@Override
	public List<com.jjzd.news.entity.bm_comment> getallCom() {
	    List<com.jjzd.news.entity.bm_comment> commentList = new ArrayList<>();
	    String sql = "select * from com";
	    Connection con = null;
	    PreparedStatement ps = null;
	    ResultSet rs = null;
	    try {
	        con = getConnection();
	        ps = con.prepareStatement(sql);
	        rs = ps.executeQuery();
	        while (rs.next()) {
	            String id = rs.getString("id");
	            String name = rs.getString("name");
	            String content = rs.getString("content");
	            com.jjzd.news.entity.bm_comment com = new com.jjzd.news.entity.bm_comment(name, id, content);
	            commentList.add(com);
	        }
	    } catch (SQLException e) {
	        e.printStackTrace();
	    } finally {
	        // 关闭资源
	        try {
	            if (rs != null) {
	                rs.close();
	            }
	            if (ps != null) {
	                ps.close();
	            }
	            if (con != null) {
	                con.close();
	            }
	        } catch (SQLException e) {
	            e.printStackTrace();
	        }
	    }
	    System.out.println("yes");
	    System.out.println(commentList);
	    return commentList;
	}

        方法4:添加评论


@Override
//添加评论
public int addCom(String id, String name, String content) {    
	String sql = "insert into com(id, name, content) values(?,?,?)";
	exceuteUpdate(sql, id, name, content);
	return 0;
}

第四步:接下来需要再news_read.jsp添加代码,保证评论可以显示,在相应评论标签添加代码

        1. 先添加一下样式

		.classlist {
			max-height: 200px; /* 设置评论区的最大高度 */
            display: flex;
            flex-direction: column;
            overflow-y: auto; /* 设置垂直滚动条 */
        }
        .bm_pl {
            background: white;
            border-bottom: 1px solid #f2f2f2; /* 设置为淡白色 */
            margin-bottom: 10px;
        }
        .username span {
            color: rgba(255, 175, 71, 0.703);
            font-weight: bold;
        }
        .comment span {
            color: rgba(0, 0, 0, 0.886);
        }
        .ip span {
            color: rgba(128, 128, 128, 0.855);
            font-size: 12px;
            font-weight: bold;
        }

        2. 添加如下代码。可以现在直接在新闻下面直接添加

<%-- TODO:笨猫在此写评论功能代码 --%>
<div class="classlist">
        <% 
        request.setCharacterEncoding("UTF-8");
        bm_comment bc = new bm_commentImpl();
        List<com.jjzd.news.entity.bm_comment> ls = null;
        // 判断表存在还是不存在
        if (bc.isComExist()) {
            // 如果存在就查询评论
            ls = bc.getallCom();
        } else {
            // 如果不存在就创建这个表
            bc.createCom();%>
        	<script type="text/javascript">
			alert("评论表没有创建,重新加载可以恢复")
			location.href="news_read.jsp";	
			</script>
         <%   
        }
       
        for (int i = 0; i < ls.size(); i++) {
        %>
        <div class="bm_pl">
            <div class="username"><span>用户名:<%= ls.get(i).getUsername() %></span></div>
            <div class="comment"><span>&nbsp;&nbsp;&nbsp;&nbsp;<%= ls.get(i).getComment() %></span></div>
            <div class="ip"><span>IP:<%= ls.get(i).getIp() %></span></div>
        </div>
        <%		 
        }
        %>
</div>

        3. 修改评论表单action../util/pinglun.jsp

        

 第五步:最后只需要把添加评论功能写上即可,在util文件夹下创建pinglun.jsp文件,在此文件填写如下代码

<%-- 本页为benmao编写 --%>
<%-- 这一页是写addCom方法 --%>

<%@page import="com.jjzd.news.dao.impl.bm_commentImpl"%>
<%@page import="com.jjzd.news.dao.bm_comment"%>
<%@ page language="java" import="java.util.*,java.sql.*" pageEncoding="utf-8"%>

<%
	request.setCharacterEncoding("UTF-8");
	bm_comment bc = new bm_commentImpl();
	String id = request.getParameter("cip");
	String name = request.getParameter("cauthor");
	String content = request.getParameter("ccontent");
	bc.addCom(id, name, content);

%>
<script type="text/javascript">
	alert("添加成功");
	location.href="../newspages/news_read.jsp";	
</script>


        这时候已经完成了新闻的评论功能,可以自行测试一波

        

  • 17
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Benmao⁢

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值