Javascript 获取元素的方法用户当前正在designMode iframe中键入？

我有一个设计模式设置为“开”的iframe。其中有多个div，因为iframe是可编辑的，所以用户可以输入并编辑其中的任何一个div。我需要禁用用户编辑其中一个div的功能

我可以防止用户像这样单击div：

document.getElementById('mydiv').addEventListener('mousedown', function(event) {
  event.preventDefault();
  return false;
}, true);

document.getElementById('mydiv').addEventListener('focus', function(event) {
  ...
}, true);

但是，用户仍然可以使用键盘上的箭头键，将光标移动到div上，然后对其进行编辑。我尝试在div接收到焦点时触发回调，如下所示：

document.getElementById('mydiv').addEventListener('mousedown', function(event) {
  event.preventDefault();
  return false;
}, true);

document.getElementById('mydiv').addEventListener('focus', function(event) {
  ...
}, true);

但这种回调从未被调用。然后我试图阻止按键：

document.getElementById('mydiv').addEventListener('keydown', function(event) {
  event.preventDefault();
  return false;
}, true);

但是，回调永远不会被调用。我甚至尝试将回调附加到文档：

document.addEventListener('keydown', function(event) {
  ...
}, true);

回调确实会被调用，但是我需要一种方法来取消事件，只有当目标元素是相关的div时

---

欢迎任何关于如何实现该目标的想法。

您可以简单地将“可编辑”类应用于任何可编辑元素，并在不需要时将其删除

YUI为此提供了一个很好的简单测试：YAHOO.util.Dom.hasClass（yourEl，'editable'）

然后在处理程序中，如果目标没有“可编辑”类，则取消/返回/预防默认/停止事件

-d

加成

---

如果您可以忽略一些较旧的浏览器，如Firefox 2，最简单的方法是不使用

设计模式，而是在每个可编辑的
上使用
内容可编辑的
，而不是在不可编辑的
上使用

<div contenteditable="true">Some editable stuff</div>

<div>Some non-editable stuff</div>

<div contenteditable="true">Some more editable stuff</div>

一些可编辑的东西
一些不可编辑的东西
一些可编辑的东西

否则，正如您所发现的，内置浏览器行为将是一场失败的战斗。
contentEditable和designMode之间是否存在实际差异（除了前者用于特定元素，后者用于整个文档之外）？我在Firefox中看到了
contentEditable
的一些缺陷，这可能是因为它的实现比
designMode
要晚得多，但总的来说你是对的：除了作用域之外没有区别。嗯……但是我使用什么回调，用于什么元素focus'和keypress'将仅为document元素而不是document.getElementById（'mydiv'）激发。如果我对文档使用“keydown”，那么target总是设置为document…我的建议是将容器的单击行为委托给一组子元素，每个子元素都应用了一个类名“editable”，如果它们是这样的话。当触发click事件时，您将在容器的默认范围内收到单击的目标，因此您可以在事件回调中检查“可编辑”类名。因此，让点击滚动进来，并挤压他们的活动，如果他们不应该是可编辑的。