鸿蒙开发者社区

WOT技术大会

公众号矩阵

移动端

短视频免费课程课程排行直播课软考学堂

全部课程厂商认证 IT技术 24年11月软考 PMP项目管理免费题库

文章资源问答课堂专栏直播

51CTO

鸿蒙开发者社区

51CTO技术栈

51CTO官微

51CTO学堂

51CTO博客

CTO训练营

鸿蒙开发者社区订阅号

51CTO软考

51CTO学堂APP

51CTO学堂企业版APP

鸿蒙开发者社区视频号

51CTO软考题库

鸿蒙开发者社区

登录/注册
51CTO

中国优质的IT技术网站

51CTO博客

专业IT技术创作平台

51CTO学堂

IT职业在线教育平台

活动短视频专栏极客Show 鸿蒙技术特刊

HarmonyOS 如何监听Web加载的h5页面滚动到了最底部？

在项目开发中，需要使用Web加载h5协议页面，需要监听用户滑动页面到了最底部。

Web组件好像没有监听滑动到最底部的监听事件，我使用Scroll嵌套Web，Scroll的onReachEnd方法也不会触发。

想问下有什么办法可以监听用户滑动到了最底部。

HarmonyOS

2024-11-05 11:57:05

浏览

赞

收藏 0

回答 1

待解决

回答 1

按赞同

/

按时间

// 示例代码参考 ets 
 
import webView from '@ohos.web.webview'; 
 
@Entry 
@Component 
struct WebViewPage { 
 
  controller: webView.WebviewController = new webView.WebviewController(); 
 
  build() { 
    Column() { 
      Web({ 
        src: $rawfile('offset.html'), 
        controller: this.controller 
      }) 
        .javaScriptAccess(true) 
        .domStorageAccess(true) 
        .verticalScrollBarAccess(true) 
        .onOverScroll((event) => { 
          if (event.yOffset < 0) { 
            console.log('已滑到顶端') 
          } 
          if (event.yOffset > 0) { 
            console.log('已滑到底端') 
          } 
        }) 
    } 
  } 
  // html 示例 ============================== 
 
  <!DOCTYPE html> 
  <html> 
  <head><title>每一天</title> 
  <style> 
  table { width: 100%; border-collapse: collapse; } th, td { border: 1px solid black; padding: 5px; text-align: center; } 
</style> 
  </head> 
  <body><h1>每一天</h1> 
  <table> 
  <tr> 
  <th>日期</th> 
  </tr> 
  <script> 
  var start = new Date(2024, 0, 1); var end = new Date(2025, 0, 1); for(var d = start; d < end; d.setDate(d.getDate() + 1)) { document.write("<tr><td>" + d.toISOString().slice(0,10) + "</td></tr>"); } 
</script> 
  </table> 
  </body> 
  </html>

回复

2024-11-05 15:10:13

如何写精华回答，获更多曝光？

发布

相关问题

HarmonyOS Web组件加载在线H5页面

275浏览 • 1回复待解决

HarmonyOS webview H5页面事件监听

41浏览 • 1回复待解决

HarmonyOS 使用web组件加载h5页面，报错17100001

39浏览 • 1回复待解决

HarmonyOS web组件加载的h5页面中判断机型

26浏览 • 1回复待解决

HarmonyOS H5页面加载缓存机制

329浏览 • 1回复待解决

HarmonyOS Web组件加载H5页面获取网络状态失败

30浏览 • 1回复待解决

HarmonyOS webview访问h5页面，底部出现遮盖

107浏览 • 1回复待解决

如何设置Web组件加载的H5页面禁用手势缩放

2469浏览 • 1回复待解决

自定义弹窗内加载h5页面，h5页面再跳转登陆页面，弹窗覆盖在登陆页面

340浏览 • 1回复待解决

HarmonyOS h5页面缩放问题

592浏览 • 0回复待解决

Web加载的H5页面跳转后，如何避免原有页面注册的资源被清空

1896浏览 • 1回复待解决

怎么禁止Web组件加载的H5页面长按复制粘贴功能？

279浏览 • 1回复待解决

如何在HarmonyOS中调试h5页面

955浏览 • 1回复待解决

HarmonyOS H5页面localstorage为null

40浏览 • 1回复待解决

如何使H5页面适配多设备？

790浏览 • 1回复待解决

HarmonyOS H5页面无法自适应展示，类似浏览器展示H5页面

91浏览 • 1回复待解决

HarmonyOS web折叠屏展示h5页面进入时会放大

568浏览 • 1回复待解决

HarmonyOS 大量webview加载远程H5页面方案设计建议

101浏览 • 1回复待解决

HarmonyOS H5页面选择图片可以从onShowFileSelector 监听到，但是H5页面选择视频的时候，从onShowFileSelector监听不到。请问是从别的方法中监听吗？

53浏览 • 1回复待解决

在Web组件的H5页面中，如何使用a标签实现打开各种页面

2074浏览 • 1回复待解决

HarmonyOS web组件显示h5页面，部分内容丢失

20浏览 • 1回复待解决

HarmonyOS h5页面通过文件加载的方式是否存在权限漏洞？

235浏览 • 1回复待解决

HarmonyOS 如何在h5页面直接拉起系统相册？

246浏览 • 1回复待解决

webview容器加载h5页面之获取剪贴板的数据

1757浏览 • 1回复待解决

HarmonyOS 访问h5页面页面底部表单获取焦点系统键盘弹出遮盖表单

39浏览 • 1回复待解决

提问

该提问已有0人参与，帮助了0人

相关讨论帖

HarmonyOS - JavaUI 框架之使用WebView加载本地H5页面 1回复

H5页面调起第三方App 0回复

基于Web组件的H5页面切换类点击操作响应时延问题分析思路&案例 0回复

基于Web组件的H5页面切换类点击操作响应时延问题分析思路&案例 0回复

webview加载Vue h5失败 0回复

Copyright © 2005-2024 51CTO.COM 京ICP证060544版权所有未经许可请勿转载