Question

我有一个contenteditable的div = true有子div。我正在尝试将一个keydown事件附加到其中一个子div以清除默认文本。但是，我无法让keydown事件发挥作用。点击事件工作正常，所以我不确定我错过了什么。

首先，我试图将焦点放在具有contenteditable设置为true的外部div上。

var $editableDiv = $("#ID");
$editableDiv.focus();

然后我想将光标移动到我希望他们输入的div。

var focusDiv = $editableDiv.children("div").children("div")[0];
var sel = window.getSelection();
var range = document.createRange();
range.setStart(focusDiv, 0);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);

现在我尝试附加keydown事件：

$(focusDiv).on("keydown", function (e)
{
  var $target = $(e.target);
  if ($target.text() === "Enter comment here")
  {
    $target.text("");
  }
}

但是这永远不会发生在keydown事件中。如果我将其更改为单击事件并单击它，它将触发。它是否与keydown没有关于contenteditable标签有关？阅读jquery手册：

当用户第一次按下键盘上的键时，keydown事件将发送到元素。它可以附加到任何元素，但事件仅发送到具有焦点的元素。可聚焦元素可以在浏览器之间变化，但是表单元素总是可以获得焦点，因此这种事件类型是合理的候选者。

这可能是一个问题，div不能真正“关注？”也许如果我给它一个tabIndex？

Answer 1

问题出在我应用焦点的地方。我将焦点应用于父div，然后将光标移动到其中一个子节点并尝试将keydown事件应用于该子节点。一旦我将它应用于父母就可以了。

jquery keydown事件不适用于contenteditable div

1 个答案: