“21天好习惯”第一期-9

本文记录了使用JavaScript实现分页功能的详细步骤,展示了部分关键代码,包括页面初始化和响应页面变化的函数。同时,通过Servlet处理请求,获取并返回分页所需的数据。此外,还分享了一道简单的编程题目,涉及数组重新排序。

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

打卡第九天!“21天好习惯”活动的进行已经快接近一半了,感觉到自己在不断的提高,对学习的态度也有了较大的改观,望继续坚持。今天又是复习和巩固这一周工作室的教学内容,主要完成了新书分页的功能,对servlet和json有了更好的了解和运用。

学习成果

 

 部分代码展示

(js)

/**
     * 分页展示
     * @param totalCounts 总的记录数
     * @param pagesize 每一页的大小
     */
    function pageInit(totalCounts,pagesize){
        $("#pagination").jqPaginator({
            totalCounts: totalCounts,//总的记录数
            pageSize: pagesize,//每一页的大小
            totalPages: Math.ceil (totalCounts/pagesize),//总的页码数
            visiblePages: 10,//可见页
            currentPage: 1,//当前页
            first: '<li class="first"><a href="javascript:void(0);">首页<\/a><\/li>',
            prev: '<li class="prev"><a href="javascript:void(0);">前一页<\/a><\/li>',
            next: '<li class="next"><a href="javascript:void(0);">后一页<\/a><\/li>',
            last: '<li class="last"><a href="javascript:void(0);">尾页<\/a><\/li>',
            page: '<li class="page"><a href="javascript:void(0);">{{page}}<\/a><\/li>',
            onPageChange: function (pageIndex) {//响应页面变化的响应函数
                alert("hhh")
                $("#text").html(pageIndex)
                pageInfo(pageIndex,this.pageSize);
            }
        });
    }

    //分页展示
function pageInfo(pageIndex,pageSize){
        var bookURL = "/shopping_war_exploded/probookid.do";
        $.getJSON(bookURL,{pageIndex:pageIndex,pageSize: pageSize},function (data){
            if(data.success){
                alert(data.productList)
                var productList = data.productList;
                var htmlval = '';
                productList.map(function (item){
                    htmlval+='<li class="row recom-1"\n' +
                        '                    style="margin-top:5px;margin-bottom:5px;display:block;height:242px;background-color:#f8f8f8">\n' +
                        '                    <div class="col-md-3" style="line-height:242px;">\n' +
                        '                        <a href="' +item.bookImage+ '"target="_blank" alt="点击看大图" class="img-thumbnail"><img\n' +
                        '                                src="'+'.'+item.bookImage+'" class="imgBook"/></a>\n' +
                        '                    </div>\n' +
                        '                    <div class="col-md-9" style="">\n' +
                        '                        <div class="row">\n' +
                        '                            <ul>\n' +
                        '                                <li><span style="font-weight:bold;font-size:14px;line-height:24px;">'+item.bookName+'</span></li>\n' +
                        '                               <li><span class="search_now_price">' +item.discount+'</span><span\n' +
                        '                                        class="search_pre_price">' +item.price +'</span></li>\n' +
                        '\n' +
                        '                                <li><span style="color:blue">' +item.bookAuthor +'</span>' +
                        '                                    <span style="color:blue">' +item.publishingName +'</span>\n' +
                        '                                    <span style="color:blue" >' +item.bookPublishTime +'</span></li>\n' +
                        '                                <li>ISBN:<span style="color:blue">' +item.bookIsbn +'</span></li>\n' +
                        '                                <li>所属分类:<span style="color:blue">' +item.bookTypeName +'</span></li>\n' +
                        '                                <li><p style="height:60px;overflow:hidden">\n' +
                        '                                    ' +item.bookIntroduction +'<</p>\n' +
                        '                                </li>\n' +
                        '                            </ul>\n' +
                        '                        </div>\n' +
                        '                        <div class="row" style="">\n' +
                        '                            <button type="button" class="btn btn-primary">收藏</button>\n' +
                        '                            <button type="button" class="btn btn-success">加入购物车</button>\n' +
                        '                            <button type="button" class="btn btn-danger">一键购买</button>\n' +
                        '                        </div>\n' +
                        '                    </div>\n' +
                        '                </li>'
                })
                $("#content-body").html(htmlval);
            }
        })
    }

(servlet)

@WebServlet(name = "QueryProductBookIdServlet", value = "/probookid.do")
public class QueryProductBookIdServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String strPageSize=request.getParameter("pageSize");
        String strPageIndex=request.getParameter("pageIndex");//当前页
        System.out.println(strPageIndex);
        System.out.println(strPageSize);
        int pageSize,pageIndex;

        try{
            pageIndex=Integer.parseInt(strPageIndex);
            pageSize=Integer.parseInt(strPageSize);
        } catch (NumberFormatException e)
        {
            pageIndex=1;
            pageSize=5;
        }

        pageIndex=Integer.parseInt(strPageIndex);
        int rowIndex=(pageIndex-1)*pageSize;

        ProductService productService=new ImplProductService();
        List<ProductDomain> list = null;
        try {
            list = productService.queryProductOrderID(rowIndex,pageSize);
            Map<String,Object> model = new HashMap<String,Object>();
            model.put("success",true);
            model.put("productList",list);

            response.setContentType("application/json;charset=utf-8");
            PrintWriter out = response.getWriter();

            ObjectMapper objectMapper=new ObjectMapper();
            out.println(objectMapper.writeValueAsString(model));
        } catch (Exception e) {
            e.printStackTrace();
        }


    }

    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request,response);
    }
}

每日一题,简单难度,下次找一个难一点的做。

 

import java.util.*;
public class Solution {
    /**
     * 代码中的类名、方法名、参数名已经指定,请勿修改,直接返回方法规定的值即可
     *
     * 
     * @param array int整型一维数组 
     * @return int整型一维数组
     */
    public int[] reOrderArray (int[] array) {
        // write code here
        int j=0;//result数组下标
        int[] result = new int[array.length];
        for(int i=0;i<array.length;i++) //先添加奇数在resul数组中,
        {
            if(array[i]%2!=0){
               result[j]=array[i];
                j++;
            }
        }
        for(int i=0;i<array.length;i++)//添加偶数在result数组中
        {
            if(array[i]%2==0){
               result[j]=array[i];
                j++;
            }
        }
        return result;
       
    }
}

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值