移动端上拉加载更多无效的问题

最新推荐文章于 2022-09-05 17:20:13 发布
最新推荐文章于 2022-09-05 17:20:13 发布
阅读量3k 收藏 3
点赞数
分类专栏： 前端 移动端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_36076584/article/details/79620534
版权
在面试中制作移动端上拉加载页面时遇到兼容性问题，pc端正常，但移动端和微信内无效。尝试通过添加WebApp全屏模式相关meta标签解决，但在微信端仍无法工作。最终发现是`<meta>`标签设置不正确，缺少`initial-scale=1, user-scalable=0, minimal-ui`，修正后成功在微信端实现上拉加载功能。" 112714971,10162428,MATLAB基础教程：运算与矩阵操作,"['MATLAB', '数值计算', '编程', '矩阵操作']
摘要由CSDN通过智能技术生成

面试的时候被要求制作一个移动端的包含上拉加载页面，在制作过程中发现了上拉加载移动端与pc端的不兼容问题。

1.上拉加载代码

http://119.28.193.164/2018/03/06/

最低0.47元/天 解锁文章
weixin_36076584
关注
专栏目录
Vue - H5 移动端列表上拉页面触底加载分页数据（支持容器局部），类似uni-app微信小程序的onReachBottom()页面触底生命周期函数（监听屏幕触底事件，实现移动端下拉懒加载效果）
王佳斌
08-21 2348
Vue - H5 移动端列表上拉页面触底加载分页数据（支持容器局部），类似uni-app微信小程序的onReachBottom()页面触底生命周期函数（监听屏幕触底事件，实现移动端下拉懒加载效果），移动端上拉加载下一页数据组件，h5触底分页加载方法，分页下拉到底部触发下一页，手机端h5懒加载，用户滚动到底部时触发数据加载分页。移动端H5前端分页加载，上拉加载新的分页数据，vue.js页面触底触发分页加载，VUE.js中怎么监听屏幕触底事件，项目移动端H5类似uni-app微信小程序的onReachBotto
移动端热点问题
最新发布
MingL520的博客
05-31 457
像素，又称画素，是图像显示的基本单位，译自英文“pixel”，pix是英语单词picture的常用简写，加上英语单词“元素”element，就得到pixel，故“像素”表示“图像元素”之意，有时亦被称为pel(picture element)像素是网页布局的基础。一个像素就是计算机能够显示一种特定颜色的最小区域。当设备尺寸相同但像素变得更密集时，屏幕能显示的画面的过渡更细致，网站看起来更明快。//ppi是指屏幕上每英寸可以显示的像素点的数量，即屏幕像素密度。
有些华为手机上拉加载更多不好使解决
weixin_49295874的博客
03-10 689
https://blog.csdn.net/zhou_w_x/article/details/106123865
H5上拉加载以及在微信内置浏览器上拉加载失效问题记录
angula
11-11 3394
第一次采用了距离顶部距离的方式来控制上拉加载 $(window).scroll(function () { // 滚动条距离顶部的距离 大于 200px时 if ($(window).scrollTop() >= nowPageNo * (nowPageNo * 100)) { console.log('距离大于200') console.log(stopPage) if (stopPage .
有些华为手机上拉加载更多不好使
zhou_w_x的博客
05-14 968
正常加载更多代码： //滚动事件触发 $(window).scroll(function(){ var scrollTop = $(this).scrollTop(); //滚动条距离顶部的高度 var scrollHeight = $(document).height(); //当前页面的总高度 var clientHeight = $(this).height(); //当前可视的页面高度 if(...
js 上拉加载更多不能正常执行遇到的问题记
xxs18326183038的博客
08-20 445
上拉加载更多的js代码用的和网上的都一样 $(window).scroll(function(){ var scrollTop = $(this).scrollTop(); var scrollHeight = $(document).height(); var windowHeight = $(this).height(); console.log(scrollTop+"--"+windowHeight+"--"+scroll
移动端上拉加载更多有时候上拉不会发起请求
hetingtingitsme的博客
03-04 617
1.安装上拉加载插件--scroll-end-refresh https://www.npmjs.com/package/scroll-end-refresh 2.代码 不要settimeout，否则在延时内都不会请求的
pc加载更多功能和移动端下拉刷新加载数据
09-01
在本文中，我们将深入探讨PC端的加载更多功能和移动端的下拉刷新加载数据这两种常见的网页数据分页加载策略。这两种方法在当前的Web开发中非常常见，它们旨在提高用户体验，减少页面加载时间，同时也降低了服务器的...
解决iframe在移动端(主要iPhone)上的问题
weixin_30333885的博客
05-10 907
前言 　　才发现已经有一段时间没有写博客了，就简单的说了最近干了啥吧。前段时间忙了杂七杂八的事情，首先弄了个个人的小程序，对的，老早就写了篇从零入手微信小程序开发，然后到前段时间才弄了个简单的个人小程序，主要是关于菜式方面制作的，原因么，就在我另外一件事情上有说到了，就是然后又弄了个个人的公众号《前端美食汇》（附：个人介绍链接）。大概之前就干了这两事。不过老实说也不用多少时间。搞得好像用了我很多...
P171-上拉加载更多的问题
m0_51414342的博客
12-24 418
方法一：（笨方法） 1.在scroll对象这里将监听注册上拉事件并把该事件发送出去 2.在Home 的scroll组件这里绑定上拉事件 3. 此时getHomeGoods()里面要加上 this.$refs.scroll.finishPullUp() 实现上拉加载功能，但是 上拉滚动区的Bug，所以在上拉加载的同时调用refresh()每一次上拉加载都要重新计算 但是这getge't ...
下拉加载更多上拉加载更多_解决更多异常的类加载问题
cusi77914的博客
06-26 268
本文是本系列文章（共四篇）中的第三篇，探讨了在Java开发过程中可能遇到的一些更复杂和异常的类加载问题。 从症状上看，这些问题的原因并不总是很明显。 结果，解决这些问题可能既困难又耗时。 与本系列中的前几篇文章一样，我们提供了一些示例来说明问题，然后讨论了各种解决方法。 在开始本文之前，您应该熟悉类加载器委托模型，以及类链接的阶段和阶段。 我们建议您先阅读本系列的第一篇文章 。 与类路...
混合开发中遇到的上拉刷新，下拉加载的问题
xueyuanying_111的博客
08-17 1472
上拉加载遇到的问题：        iscroll: 可以实现上下拉刷新，加载，效果比较差，可是在页面上只能上下滑动，不能左右滑动，如果你的页面嵌入到客户端的tab底下，就会组织他们的左右滑动，               如果想要实现左右切换，就得把iscroll插件中的   onBeforeScrollStart: function (e) { e.preventDefault();
实现webview只能下拉，不能上拉。
Lucky_Deng的博客
06-30 2246
我们都知道现在h5越来越火，很多app都是用h5写的，有得时候我们想要实现上拉刷新，下拉加载，但是现在网页上面，上拉刷新就是很容易实现，我们只要重新请求网页就可以了，但是下拉加载就有问题，后端人员必须知道webview滑到底部才能实现加载更多的方法，所以如果我们把bounces关了的话，刷新我们就不能实现，所以现在我们就需要实现上拉可以，下拉不行，这就能达到我们想要的结果，啥也不说，直接上代码：
uniapp开发使用插件z-paging实现页面下拉刷新、上拉加载，分页加载
热门推荐
qq_43799179的博客
09-05 1万+
uniapp实现开发下拉刷新、分页显示，上拉加载更多等
uniapp列表页面无法上拉加载更多
zhanglei892721的博客
06-24 2047
记录一下我出现的问题： 列表定义一页显示6条数据，但是6条数据无法纵向铺满整个手机屏幕，导致无法触发onReachBottom这个事件，也就无法调用加载更多方法。 解决方法： 给当前vue页面添加样式 page{ height:101% } 搞定！ ...
html5 浏览器适配问题
licyXiaobaiyang的博客
11-10 2850
QQ 浏览器x5内核定制标签说明 设置屏幕方向 1 meta name="x5-orientation" content="portrait|landscape" /> 设置全屏 1 meta name="x5-fullscreen" content="true" />
meta 标签技巧
qq_37493515的博客
09-22 214
忽略自动识别电话 <meta name="format-detection" content="telephone=no"> 忽略自动识别邮箱 <meta name="format-detection" content="email=no"> 忽略自动识别电话和邮箱 <meta name="format-detection" content="telephone=no, email=no"> 禁止页面缩放 在智能手机的普及下，很多网站都具备桌面端和移动端两种浏览版本
Vue Loadmore组件实现移动端上拉加载更多实战
在移动端H5开发中，为了适应小屏幕设备的用户体验，上拉加载更多是一种常见的交互方式。本文将介绍如何在Vue应用中实现一个可复用的loadmore组件，该组件用于在用户滑动到底部并上拉一定距离时自动加载下一页内容。 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值