Javascript 内联编辑，但实例不'；不存在

我有自己的自定义非jQuery ajax，用于编写web应用程序。我最近在使用TinyMCE时遇到IE9问题，所以我尝试切换到CKeditor

可编辑文本被包装在div中，如下所示：

<div id='content'>
  <div id='editable' contenteditable='true'>
    page of inline text filled with ajax when links throughout the site are clicked
  </div> 
</div>

得到这个：

未捕获的TypeError:无法调用未定义的方法“getData”

所以我想它不知道编辑器在dom中的位置。。。我尝试通过所有编辑器获取编辑器名称，但这不起作用——似乎找不到任何名称

我试过这个：

for(var i in CKEDITOR.instances) { 
  alert(CKEDITOR.instances[i].name);
}

警报是空白的，因此显然没有与之相关的名称

我还应该提到，尽管我尽了最大的努力，但我似乎无法让可编辑文本在其上方显示菜单，就像它在

谢谢你能带来的任何帮助

杰森·西尔弗

更新：

我在这里炫耀我的知识不足，但我以前从未遇到过“contentediate='true'，”，所以认为因为我能够内联键入，所以编辑器以某种方式被实例化。。。但现在我想知道编辑是否被应用到我的div中

更新2：

加载页面并最初调用脚本时，div不存在。使用AJAX将可编辑div发送到DOM中@Zee在下面留下了一条评论，这让我想知道是否应该调用其他命令来将编辑器应用于该div，因此我在页面中创建了一个按钮，并使用以下onclick来测试这种方法：（改编自ajax示例）

这会在Chrome中产生以下错误：

> Uncaught TypeError: Cannot call method 'equals' of undefined 
>  + CKEDITOR.tools.extend.getEditor ckeditor.js:101
>    b ckeditor.js:252
>    CKEDITOR.appendTo ckeditor.js:257
>    onclick www.pediatricjunction.com:410

我的方向对吗？有没有另一种方法可以通过编程告诉CKEditor将编辑器应用于div

更新3：

多亏了@Reinmar，我有了新的尝试。要测试这是否是解决方案，最明显的方法是在content-editable div上方放置一个按钮，分别称为CKEDITOR.inlineAll（）和inline（'editable'）：

<input type='button' onclick=\"CKEDITOR.inlineAll();\" value='InlineAll'/>
<input type='button' onclick=\"CKEDITOR.inline('editable');\" value='Inline'/>
<input type='button' onclick=\"var editor = CKEDITOR.inline( document.getElementById( 'editable' ) );\" value='getElementById'/>

更新4：

在进一步修改之后，我找到了与json2007.js相关的问题，这是一个我使用的脚本，它可以处理真实的简单历史（RSH.js）。这些脚本的目的是跟踪ajax历史，因此当我在浏览器中来回移动时，ajax页面视图不会丢失

---

这是FIDLE页面：

当您想要初始化内联编辑器时，有两种方法：

如果加载页面时存在可编辑的元素（具有

contenteditable

属性），则编辑器将自动为其初始化一个实例。它的名称将取自该元素的id，或者它将是

编辑器

。您可以在上找到自动初始化的编辑器

如果这个元素是动态创建的，那么您需要自己初始化编辑器。 例如，在文档中添加

X

后，您应该调用：

CKEDITOR.inline（'editor'）

或

CKEDITOR.inlineAll（）

见和。 您可以在上找到以这种方式初始化的编辑器

这种方法有不同的用途。可以在指定元素内初始化主题化（非内联）编辑器。当所有其他方法（

CKEDITOR.inline

，

CKEDITOR.replace

，

CKEDITOR.inlineAll

）从正在替换/使用的元素中获取数据时，此方法也接受编辑器的数据（作为第三个参数）

更新

---

我检查了您与CKEditor一起使用的库是否编写得很差，并导致您提到的错误。删除

json2007.js

和

rsh.js

，CKEditor工作正常。

好的，我已经找到了问题所在

我用来跟踪Ajax历史并记住后退按钮的命令的库称为RealSimpleHistory，它使用了一个名为json2007的脚本，该脚本是侵入性的，并且扩展了本机原型，直到出现问题

js有点老了，我没有充分利用它的潜力，所以我的最终解决方案是重写我需要的基本代码，也就是说，一个监听器监视URL中的锚（散列）更改，然后解析这些更改并重新提交ajax命令

var current_hash = window.location.hash;
function check_hash() {
    if ( window.location.hash != current_hash ) {
        current_hash = window.location.hash;
        refreshAjax();
    }
}
hashCheck = setInterval( "check_hash()", 50 );

无论如何，“refreshAjax（）”是一个现有函数，因此这实际上是一个比我在实际简单历史中使用的更优雅的解决方案

剥离了json2007.js脚本之后，其他一切都正常工作了，而且CKEditor非常漂亮

---

非常感谢你的帮助，@Reinmar。。。感谢您的耐心和努力。

我很好奇，CKEDITOR.instances.editable不存在，但是CKEDITOR.instances[I]。name只是空的吗？如果调用CKEDITOR.instances[i].getData（），会得到什么结果吗？如果您没有看到工具栏，那么这意味着特定的div没有内联，自动内联打开了吗？在激活CKEDITOR之前，页面上是否存在这些div？我将您的示例粘贴到CKEDITOR包中的

inlineall.html

文件中，一切正常（至少在Chrome上）。名为

editable

的实例存在并正常工作。您可以尝试创建JSFIDLE来显示您的问题吗？好的，我应该在实例[I]中包含getData的结果，抱歉@Zee。请求实例[i]。getData导致Chrome Uncaught TypeError中出现错误：对象函数（w）{var a=[]，k，i，v；等…我不熟悉ckeditor，但是，你添加了它的css？它不是jquery的插件吗？@Ark它是一个WYSIWYG编辑器，不是插件。我的问题与javascript有关，但感谢你的评论。谢谢@Reinmar…我还可以尝试其他什么吗？这似乎没有帮助（见上文）.正如我之前所写的-如果你没有上传整个页面，很难猜出你做错了什么。不确定这是否适合提问-但我可以付钱让你登录我的示例站点并查看代码吗？问题是我需要向你发送密码，但我不想在这里输入密码

<input type='button' onclick=\"CKEDITOR.inlineAll();\" value='InlineAll'/>
<input type='button' onclick=\"CKEDITOR.inline('editable');\" value='Inline'/>
<input type='button' onclick=\"var editor = CKEDITOR.inline( document.getElementById( 'editable' ) );\" value='getElementById'/>

Uncaught TypeError: Cannot call method 'equals' of undefined ckeditor.js:101
+  CKEDITOR.tools.extend.getEditor ckeditor.js:101
   CKEDITOR.inline ckeditor.js:249
   CKEDITOR.inlineAll ckeditor.js:250
   onclick

var current_hash = window.location.hash;
function check_hash() {
    if ( window.location.hash != current_hash ) {
        current_hash = window.location.hash;
        refreshAjax();
    }
}
hashCheck = setInterval( "check_hash()", 50 );