| |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
-> Java知识库 -> 做黑马旅游项目的难点概括tomcat+json+jquery+html+css -> 正文阅读 |
|
[Java知识库]做黑马旅游项目的难点概括tomcat+json+jquery+html+css |
【1】在我做黑马的旅游项目的时候,虽然跟着视频做,但是做完后还是对自己写的代码不太熟悉,主要就是思路的问题,其他问题都好解决 【2】首先就是网站的分页功能 ??????? 思路: ????????1.当我们做分页的时候,第一步不应该是想这个分页应该长什么样,那是前端干的事儿,而是应该,立刻想到,currentPage ,totalPage,startPage,pageSize这几个变量,因为我们需要这几个变量来去写dao中的sql语句,例如 ??????? select? count(*)from tab_route where cid=? limit startPage,pageSize ??????? 这样我就就可以决定,每一页的数据从哪开始查,查多少 ??????? 然后然后我们就应该考虑template的用法, 这里我知道肯定是查询多条语句的,所以就用query执行,然后返回了一个list集合 ????? ?? 2.第二步,我们就要用service逻辑层来调用我们写的dao方法,思考一下,在这个层里,我们需要写一些什么,以及用到哪些参数,首先是startPage,这个怎么得出呢? ?????????????? ??????????????????????????????? startPage=(currentPage-1)*pageSize ??????? ??? 这样,我们的startPage就得到了 ??????????? 而currentPage,应该在Servlet层中获取,前端的数据, ??????????? 而前端的currentPage怎么得到呢,这里我们先不管,疑点1 ??????????? 在service中我们先把总页数totalPage解决 ??????????? totalPage,就需要我们再去dao中写一串sql语句,先查询处所有的数据总量 ????????????????select count(*) from tab_route where cid=? ??????????? 得到了数据总量后,我们在想一下,totalPage和数据总量之间的关系是什么 ?????????????????????????? totalPage=totalCount%pageSize=0?totalCount%pageSize:totalCount%pageSize+1 ?????????? 这里的pageSize ,是我们自己设定的,所以不用担心 ??? ?????????? 到了这里我们需要分页的数据就都齐了,但是还有一个问题,就是将来如果我们利用ajax把我们获得的数据返回之后,我们是不是还要做一个分页之后,上面内容的展示呢,比如说我将来要在上面展示5条信息,那么信息的数据该怎么也传过去,因为分页操作和动态数据展示操作可以在一起完成的。我们不能单纯的分页,然后每页的内容就不管了 ?????????? 所以在我们获取了以上的数据之后,我们还要获取内容的数据,也就是第一条sql语句,返回的List集合,所以我们需要把这一切都传到前端去,这一步,我们就需要再定义一个类pageBean,专门装我们这些数据,然后利用ajax传回前端 ??????? 3.这时候就到了servlet层,我们需要把pageSize,currentPage解决掉,首先解决pageSize,这里我们自己定义就好,想设为几都行,然后传到调用service中方法的参数中,其次就是我们的第一个疑问,这里先设为1,也就是currentPage为第一页,防止报错,然后调用方法,返回pageBean ,这个对象里包括了,currentPage,List<Route>,totalPage,totalCount,pageSize 【3】剩下来就是前端的调用的事情,? 首先Cid的获取,就是我们获取href上的字符串,这里不讲
???????? 1.这里我们先把totalPage和totalCount在页面上显示,可以利用sql数据库比对以防哪里出错 ???????? 2.注意看,这里是一个load方法,并不是$.(function)加载,因为我们的currentPage,需要手动传参,而不是从哪里获取 ???????? ???????? 这里我们可以先看一下,前端人员写的界面,然后,我们最重要的一步来了,就是 ??????? οnclick=“javascript:load(.......)” ??????? 是的就是类似于迭代,我们自己调用自己,这样在页面上每点一次分页栏的按钮,我们就可以重新加载,然后传入currentPage参数,如果是刚进入这个页面呢,之前提到了,我们默认状态下在Servlet中将currentPage设置为1,这里我们就可以加一个if语句,如果获取到了currentPage,那么我们就把参数传进去,没获取到就传1。 ?????? 然后我们再编写上一下和下一页的li窗口 ???????? ???????? 这个时候currentPage的作用就体现出来了,而且,大家需要注意,如果before(也就是上一页)的页码数小于1,那么就需要回到第一页,不然会报错和数据丢失。 ??????? 下一页的写法类似,这里跳过....... ??????? 下一步,这里事先我知道数据库里有500多条数据,如果每页展示5条,会有几百页数据,然后,再不进行任何处理的情况下,我们就会发下,下面的分页栏多的离谱,这里需要小处理一下 ???????? ???????? 我定义一个begin和end,也就是下面的分页栏只能展示10页数据,如果当前页码在10页内,就只展示10页,如果当前页码在11页,那么我们就把下面分页栏的范围定在,6-15页之间。 ???????? ???????? 然后就是页码的拼接 ??????? 最后再把li用html写入即可 ???????? ??????? 这样,分页就做好了,每点一次,就是重新加载load 方法,然后,刷新界面显示新的内容。 【4】填充的方式和分页中li的拼接差不多,先得到我们前端写的数据 ???????? ? ???????? 这里,我们只需要把其中的静态数据,改为数据即可,还记得我们之前返回的List<Route>对象嘛,这里他就有用处了。 ??????? 首先我们应该知道,我们的dao层,sql语句,是已经limit过的,从哪开始查,差几个,我们已经把currentPage传入,所有startPage,和pageSize,都已经解决了,点哪页,就会返回对应的List<Route>数据,我们要做的就是写for循环语句,然后把Route对象拿出来,然后把静态数据改为动态数据即可。 ???????? 【5】最后,我们当然不能忘记了写$.(function)加载语句 ???????? 这里填入currentPage=null,是因为,我们已经在servlet中定义了,如果为空,就是1, ???????? ????????到这里,我们的分页大概就是这样了,其他的都是一些小细节,大家需要自行联系,因为我也是刚刚学呢。 ????????? ???????????????? ? |
|
|
上一篇文章 下一篇文章 查看所有文章 |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 | -2024/11/23 22:24:28- |
|
网站联系: qq:121756557 email:121756557@qq.com IT数码 |