自定义MVC新书上架及热门书籍展示

最新推荐文章于 2025-05-21 14:01:18 发布

大佬员阿乐

最新推荐文章于 2025-05-21 14:01:18 发布

阅读量111

点赞数

文章标签： mvc easyui sql

本文链接：https://blog.youkuaiyun.com/m0_60390944/article/details/120604792

版权

本文介绍了如何使用BookDao进行新书上架（通过SQL查询并返回最新状态为2的书籍）和热门书籍的获取（按部署时间排序）。同时展示了在index.jsp中通过AJAX请求调用BookAction，动态更新热门书籍列表的代码片段。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一：新书上架

1、BookDao

/**
	 * 处于上架状态的书籍，新书
	 * @param book
	 * @param pageBean
	 * @return
	 * @throws Exception
	 */
	public List<Book> news(Book book, PageBean pageBean) throws Exception {
		//给sql进行时间的排序
		String sql="select * from t_easyui_book where state = 2 order by deployTime desc limit 2";
		return super.executeQuery(sql,Book.class, pageBean);
	}

2、BookAction

public void news(HttpServletRequest req, HttpServletResponse resp) {
        try {
            List<Book> list = bookDao.news(null, null);
            ResponseUtil.writeJson(resp, list);
        } catch (Exception e) {
            e.printStackTrace();
            try {
                ResponseUtil.writeJson(resp, 0);
            } catch (Exception e1) {
                e1.printStackTrace();
            }
        }
    }

3、修改index.jsp界面（ajax请求；其中将要将data.rows改为data，不然不会显示书籍）

 $(function () {
        //   上架新书
        $.ajax({
            url: '${pageContext.request.contextPath}/book.action?methodName=news',
            dataType: "json",
            data: "rows=18",
            success: function (data) {
                // data = eval(data);
                // $(".c-category").next().append("444");
                 debugger;
                 alert(data);
                console.log(data);
                single_item($(".c-category:eq(0)"), data, 0, "");
 
                // debugger;
            }
        });

4、single_item(）方法为样式的拼接（递归方法）

function single_item($node, data, level, htmlstr) {
            // debugger;
            var start = level * 6;
            htmlstr += '<div class="row">';
 
            for (var i = 0; i < 6; i++) {
                if (data.length == start) {
                    break;
                }
                htmlstr += '<div class="col-md-2">'
                htmlstr += '<figure class="figure">';
                htmlstr += '<img src="' + data[start].image + '" class="figure-img img-fluid rounded" alt="...">';
                htmlstr += '<figcaption class="figure-caption">';
                htmlstr += '<p>' + data[start].name + '</p>';
                htmlstr += '<i class="text-danger">' + data[start].price + '</i>';
                htmlstr += '</figcaption>';
                htmlstr += '</figure>';
                htmlstr += '</div>';
                start++;
            }
            htmlstr += '</div>';
 
            level++;
            if (start < data.length) {
                single_item($node, data, level, htmlstr);
            } else {
                $node.after(htmlstr);
            }
        }

功能结果展示：

二：热门书籍（思路同上）

1、BookDao

public List<Book> hots(Book book, PageBean pageBean) throws Exception {
		//给sql进行时间的排序
		String sql="select * from t_easyui_book where state = 2 order by deployTime desc limit 3";
		return super.executeQuery(sql,Book.class, pageBean);
	}

2、BookAction

public void hots(HttpServletRequest req, HttpServletResponse resp) {
        try {
            List<Book> list = bookDao.hots(null, null);
            ResponseUtil.writeJson(resp, list);
        } catch (Exception e) {
            e.printStackTrace();
            try {
                ResponseUtil.writeJson(resp, 0);
            } catch (Exception e1) {
                e1.printStackTrace();
            }
        }
    }

3、主界面修改

 //   热销书籍
        $.ajax({
            url: '${pageContext.request.contextPath}/book.action?methodName=hots',
            dataType: "json",
            data: "rows=18",
            success: function (data) {
                // data = eval(data);
                // $(".c-category").next().append("444");
                console.log(data);
                single_item($(".c-category:eq(1)"), data,0, "");
 
                // debugger;
            }
        });

效果展示