简体   繁体   English

CKEditor主体上的Document.getElementById返回null

[英]Document.getElementById on CKEditor body returning null

I need to set the spellcheck attribute of the rich text editor provided by Salesforce to true. 我需要将Salesforce提供的富文本编辑器的spellcheck属性设置为true。 However, the body component on which the attribute is specified always returns null. 但是,在其上指定属性的主体组件始终返回null。

Due to this I am not able to change the attribute value. 因此,我无法更改属性值。 What am I doing wrong? 我究竟做错了什么? I am not even able to use jQuery selectors for the same. 我什至不能使用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>

It's too soon. 还为时过早。

This script fires as soon as this line of code is encountered. 一旦遇到此行代码,就会触发此脚本。 At that time the original <textarea> is still present on the page and the decorators didn't run (decorators hide the original tag and inject an <iframe> with whole RTF editor instead). 那时原始的<textarea>仍然存在于页面上,装饰器没有运行(装饰器隐藏原始标签,而是使用整个RTF编辑器注入<iframe> )。 You can verify it because the execution stops while it's showing this alert() . 您可以验证它,因为在显示此alert()执行停止了。

The cleanest way would be to override the onload function (or wherever it is that decorators run) similar to how these posts do it: 最干净的方法是重写onload函数(或装饰器在任何地方运行),类似于这些帖子的工作方式:

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

Not sure why but it seems even such custom onload is too soon (I don't have time to debug it further). 不知道为什么,但是似乎这样的自定义onload还为时过早(我没有时间进一步调试它)。

So, as ugly as it is - this seems to work for me: 因此,尽管很丑陋-这似乎对我有用:

<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>

Feel free to experiment, prettify it with jQuery's contents() if you want... There are lots of questions over here how to nicely access an iframe with jQuery, for example How to get the body's content of an iframe in Javascript? 随意尝试,如果需要,可以使用jQuery的contents()美化。在这里有很多问题,如何使用jQuery很好地访问iframe,例如, 如何在Javascript中获取iframe的主体内容?

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM