CKEditor正文上的Document.getElementById返回空 [英] Document.getElementById on CKEditor body returning null

问题描述

我需要将Salesforce提供的富文本编辑器的拼写检查属性设置为true。但是，指定属性的正文组件始终返回NULL。

因此，我无法更改属性值。我做错了什么？我甚至无法使用jQuery选择器进行相同操作。

<apex:page >
  <apex:form >
    <apex:inputTextarea richText="true" id="rta"/>
  </apex:form>
  <script>
    alert(document.getElementById('j_id0:j_id1:rta_rta_body'));
  </script>
</apex:page>

推荐答案

太快了。

只要遇到此行代码，此脚本就会触发。当时，原始的<textarea>仍然存在于页面上，装饰器没有运行(装饰器隐藏原始标签，而使用整个RTF编辑器注入<iframe>)。您可以对其进行验证，因为在显示此alert()时执行会停止。

最干净的方法是覆盖onload函数(或修饰器运行的任何位置)，类似于这些POST的操作方式：

1. http://bobbuzzard.blogspot.co.uk/2011/05/onload-handling.html
2. https://developer.salesforce.com/forums?id=906F0000000957DIAQ

不确定原因，但即使是这样的自定义onload似乎也太快了(我没有时间进一步调试它)。

所以，尽管它很难看-这似乎对我很管用：

<apex:page >
    <apex:form >
        <apex:inputTextarea richText="true" id="rta"/>
    </apex:form>
    <script>
    function setSpellChecker(){
        var iframe = document.getElementById('j_id0:j_id1:rta_frame');
        var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
        iframeDocument.getElementsByTagName('body')[0].spellcheck = true;
    }
    window.setTimeout(setSpellChecker, 1000); // fire after 1 second
    </script>
</apex:page>

您可以随意尝试，如果您愿意，可以使用jQuery的contents()对其进行美化.这里有很多关于如何使用jQuery很好地访问IFRAME的问题，例如How to get the body's content of an iframe in Javascript?

这篇关于CKEditor正文上的Document.getElementById返回空的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！