历史版本7 :JS实现键盘翻页效果 返回文档
编辑时间:
内容长度:图片数:目录数:
修改原因:
1. 问题描述编辑
当我们将报表做成 ppt 效果，在演示时想使用键盘的上下键、左右键或空格键实现上下键翻页，该如何实现呢？
2.实现思路编辑
通过 JavaScript 获取按下按键的键值，判断是否跳转上一页或下一页。
3. 示例编辑
点击菜单模板>模板 Web 属性>分页预览设置，选择“为该模板单独设置”，添加一个“加载结束”事件，编辑加载结束事件，添加下面的 JS 代码：
$(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") {
contentPane.gotoNextPage();
}
})代码说明：
$(document).bind('keydown', function(e) {}) //获取键盘按键按下事件
var key = window.event ? e.keyCode : e.which; //获取按键键值
contentPane.gotoPreviousPage(); //跳转到上一页
contentPane.gotoNextPage(); //跳转到下一页键盘按键对照表如下：
| 对应按键 | 按键十进制值 |
|---|---|
| 空格键（Space键） | 32 |
| Page Up键（PgUp键） | 33 |
| Page Down键（PgDn键） | 34 |
| LEFT ARROW键（←） | 37 |
| UP ARROW键（↑） | 38 |
| RIGHT ARROW键（→） | 39 |
| DOWN ARROW键（↓） | 40 |
保存模板，点击分页预览，当按键为 Page Up键（PgUp键）、LEFT ARROW键（←）、 UP ARROW 键（↑），即可跳转到上一页，
当按键为空格键（Space 键）、Page Down键（PgDn键）、RIGHT ARROW键（→）、DOWN ARROW 键（↓）即可跳转到下一页；