使用jqueryMobile怎么分页

2025-03-01 05:19:59
推荐回答(1个)
回答1:

1、jquery-mobile-iscrollview下载
解压后的\jquery-mobile-iscrollview-master\jquery-mobile-iscrollview-master\demo\source路径下是需要引用的js和css文件

\jquery-mobile-iscrollview-master\jquery-mobile-iscrollview-master\demo\build路径下是各个jquery mobile版本下的列表和滚动翻页的例子

在该路径下,我选择了pull_14.html文件,用chrome打开后,发现下面的导航栏变形,将




去掉后,下面的导航栏正常了

页面中引用的pull-example.js文件是上拉、下拉事件的处理,只需要将gotPullDownData和gotPullUpData函数修改一下即可实现自己需要加载的数据

2、直接测试该功能没有什么问题,当把该翻页的页面链接到其他页面上时,通过链接打开该页面,下面的导航栏又出现了问题
后来发现,这是问题可能是由于jqm的外部页面链接引起的错。jqm在使用外部链接打开另一个页面时,会使用ajax读取需要打开的文件,然后将该文件动态加载到已经打开的页面的后面,jqm只加载文档中取出的第一个页面(第一个带有role="page"的div),其他内容都将被忽略。
后来,将列表页面(b.html)所有加载的css和js的标签放到链接该页面的页面(a.html)的标签中。

[html] view plain copy

content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />




rel="stylesheet" type="text/css" />
media="screen" rel="stylesheet" type="text/css" />








当链接打开该页面后,列表页面稳定了

3、jquery-mobile-iscrollview中引用的jqm框架的版本没有项目中的高,试着将jqm的版本替换为项目中使用的版本后,该功能依旧没有出现问题