3

我正在使用 Hakim El Hattab 的reveal.js 来制作演示幻灯片。我已将 textarea 添加到幻灯片中。在 textarea 中,我想防止在按下某些键时调用 javascript 函数,并恢复默认的键入行为。例如,从以下代码行中可以看到,reveal.js,当p按下时,会调用一个函数navigatePrev()。我想阻止这个函数被调用,只是想在按下p时在文本区域中输入。p我怎样才能使用 jquery 做到这一点?我尝试添加以下脚本,但这无济于事。

<script>
  $(document).keydown(function (e) {
    if ($(e.target).is('textarea')) {
      e.stopPropagation();
    }
  })
</script>

在reveal.js 中定义的函数仍然被调用。使用return false代替e.stopPropagation()也无济于事。我还在页面的最后包含了上面的 jQuery 行(在调用reveal.js 之后)。

谢谢你。

来自reveal.js的相关行

function onDocumentKeyDown(event) {
  // FFT: Use document.querySelector( ':focus' ) === null 
  // instead of checking contentEditable?

  // Disregard the event if the target is editable or a 
  // modifier is present
  if (event.target.contentEditable != 'inherit' || event.shiftKey || event.altKey || event.ctrlKey || event.metaKey) return;

  var triggered = false;

  switch (event.keyCode) {
    // p, page up
    case 80: case 33: navigatePrev(); triggered = true; break;
    // n, page down
    case 78: case 34: navigateNext(); triggered = true; break;
    // h, left
    case 72: case 37: navigateLeft(); triggered = true; break;
    // l, right
    case 76: case 39: navigateRight(); triggered = true; break;
    // k, up
    case 75: case 38: navigateUp(); triggered = true; break;
    // j, down
    case 74: case 40: navigateDown(); triggered = true; break;
    // home
    case 36: navigateTo(0); triggered = true; break;
    // end
    case 35: navigateTo(Number.MAX_VALUE); triggered = true; break;
    // space
    case 32: overviewIsActive() ? deactivateOverview() : navigateNext(); triggered = true; break;
    // return
    case 13: if (overviewIsActive()) { deactivateOverview(); triggered = true; } break;
  }
}
4

2 回答 2

5

您的 keydown 事件绑定的问题在于它绑定到接收事件 LAST 的文档(一旦为时已晚,无法阻止事件在 DOM 树中进一步冒泡)。

相反,请尝试在每次创建事件时将事件直接绑定到 textarea:

// create text area & append to slide container
createTextAreaOnSlideContainer();

// bind an event handler to the element
$('textarea.slideTextArea').keydown( function(e) {
    e.stopPropagation();
});

这将在事件冒泡(传播)到正在侦听要按下的键的文档之前停止事件

于 2012-09-02T01:27:25.030 回答
-1

你可以这样做:

$(document).keydown(function(e){
 if(!$('#textarea').is(':focus')){
    yourfunction();
    }
});

您只需在其中添加一条if语句,如果 textarea 没有聚焦,则调用该函数。

于 2012-09-02T01:38:34.650 回答