捕捉“Page Down” / “Page Up”键事件的问题

Question

我需要在元素滚动时捕获PageUp/PageDown键的按下事件，但我一直无法做到。我尝试过

监听 'keydown' 事件**：当非滚动元素处于焦点状态时触发事件，但当滚动元素处于焦点状态时，没有事件会被触发。

 $(window).on('keydown', function(e)
 {
    console.log(e.keyCode === 34);
 });

监听 "keypress" 事件：在任何上下文中都没有触发事件

$(window).on('keypress', function(e)
{
    console.log("keypress"); //does nothing
});

监听“scroll”事件：在任何上下文中都没有触发事件。

$(window).scroll(function()
{
    console.log("scrolling"); //does nothing
});

我感到困惑，但是找不到任何线索。我已经在jsFiddle中尝试了我的当前代码，并且它可以正常工作，所以问题一定更具体。

- DanTheMan

---

忘记在问题中包含括号，但是它们在代码中。 - DanTheMan

Answer 1

使用 document 替代 window，这样它会考虑当前网页文档。

你的代码中有括号不匹配。

 $(document).ready(function(){
     $(document).keypress(function(e){
      if(e.keyCode === 34){
         console.log('page down')
        }

    });
 

    $(document).keypress(function(e){
       console.log("keypress"); //console will print
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

希望这对你有所帮助。

- Santosh

---

这与窗口或文档无关，即使它们附加了window，这些事件也会触发。 - cнŝdk

根据我的观点，我已经给出了答案。我认为在编程语言中有更多的情景和更多的实现方式。 - Santosh

我忘记在问题中包含括号了，但是在我的代码中有。我更新了我的问题。 - DanTheMan

@DanTheGameMam 请检查给出的答案并点击运行代码片段。 希望能有所帮助。 - Santosh

@webdeveloper，你的代码没问题，但问题是我的SlickGrid元素正在触发它自己的滚动事件。 - DanTheMan

Answer 2

你也可以试试吗？

$(window).bind('keydown', function(event) {
  console.log(event.which === 33) });

event.which属性返回事件中按下的键盘按键或鼠标按钮

- brainfood

---

没有改进。我已经在jsFiddle中尝试了我的当前代码，它可以正常工作，所以问题一定是特定于这个应用程序的。 - DanTheMan

Answer 3

所以我想要滚动的元素是一个SlickGrid表格，它有自己的滚动事件。

所以我根据他们的文档编写了代码：

this.grid.onScroll.subscribe(function(e, args)
{
    console.log(e);
}

现在它会在按下“Page Down/Page Up”键时触发。

- DanTheMan

Answer 4

实际上，您的语法不正确，您在函数末尾缺少一个闭合的)，您应该写成：

$(window).on('keydown', function(e) {
  console.log(e.keyCode === 34);
});

$(window).on('keypress', function(e) {
  console.log("keypress"); //does nothing
});

$(window).scroll(function() {
  console.log("scrolling"); //does nothing
});

#scroll {
  max-height: 100px;
  height: 100px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="scroll">

  <br>fghfjkjgfj
  <br/>dfdfdfdf
  <br/>dfdsf
  <br/>
  <br/>
  <br/>dfdfdf
  <br/>
  <br/>
  <br/>ssdsds
  <br/>fdf
  <br/>
  <br/>
  <br/>
  <br/>fgfgfg
  <br/>End
</div>

一切都会按预期运作。

- cнŝdk

---

我忘记在问题中包含括号了，但是在我的代码中是有的。已更新我的问题。 - DanTheMan

@DanTheGameMan 你在哪个浏览器上运行你的代码？ - cнŝdk