反馈已提交

网络繁忙

JS实现键盘翻页效果

  • 文档创建者:cherishdqy
  • 历史版本:10
  • 最近更新:RosieY 于 2022-08-30
  • 1.概述

    1.1 问题描述

    当我们报表有多页时,在展示时想使用键盘的上下键、左右键或空格键实现对报表的操作,如上下键实现翻页,该如何实现呢?

    1.2 实现思路

    通过 JS 获取按下按键的键值,根据键值对报表进行判断翻页操作。

    2. 示例

    1)准备一个预览时多页呈现的模板。

    2)点击菜单模板>模板 Web 属性>分页预览设置,选择 为该模板单独设置,添加一个加载结束事件,如下图所示:

    JavaScript 代码如下:

    //获取键盘按键按下事件
    $(document).bind('keydown', function(e) {
    //获取按键键值
    var key = window.event ? e.keyCode : e.which;
    //alert(key);
    if (key.toString() == "33"|| key.toString() == "37" || key.toString() == "38") {
    //跳转到上一页
    contentPane.gotoPreviousPage();

    else if (key.toString() == "32" || key.toString() == "34"|| key.toString() == "39" || key.toString() == "40") {
    //跳转到下一页
    _g().gotoNextPage();
    }
    })

    键盘按键对照表如下:

      对应按键 按键十进制值 
      空格键(Space键)  32
      Page Up键(PgUp键)  33
      Page Down键(PgDn键) 34 
      LEFT ARROW键(←)37  
      UP ARROW键(38  
      RIGHT ARROW键(→)39  
      DOWN ARROW键(40  

    3)保存模板,点击分页预览,当按键为 Page Up键(PgUp键)、LEFT ARROW键(←)、  UP ARROW 键(↑),即可跳转到上一页,

    当按键为空格键(Space 键)、Page Down键(PgDn键)、RIGHT ARROW键(→)、DOWN ARROW 键(↓)即可跳转到下一页。

    注:不支持移动端。

    附件列表


    主题: 二次开发
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭



    AI

    联系我们
    在线支持
    获取专业技术支持,快速帮助您解决问题
    工作日9:00-12:00,13:30-17:30在线
    页面反馈
    针对当前网页的建议、问题反馈
    售前咨询
    采购需求/获取报价/预约演示
    或拨打: 400-811-8890 转1
    qr
    热线电话
    咨询/故障救援热线:400-811-8890转2
    总裁办24H投诉:17312781526
    提交页面反馈
    仅适用于当前网页的意见收集,帆软产品问题请在 问答板块提问前往服务平台 获取技术支持