Javascript CKEditor - 不显示

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12166916/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 07:17:43  来源:igfitidea点击:

CKEditor - Does not show up

javascriptckeditor

提问by Maik Klein

I am trying to integrate the ckeditor into my website written in java with play2.

我正在尝试将 ckeditor 集成到我用 play2 用 java 编写的网站中。

Now I downloaded the javascript files and read though the samples.

现在我下载了 javascript 文件并阅读了示例。

I figured that the important part is ckeditor.js

我认为重要的部分是 ckeditor.js

<script type="text/javascript" src="/assets/javascripts/ckeditor.js"></script>

I also used the exact same form from the samples

我还使用了样本中完全相同的形式

<form action="sample_posteddata.php" method="post">
        <label for="editor1">
            CKEditor using the <code>docprops</code> plugin and working in the Full Page mode:</label>
        <textarea cols="80" id="editor1" name="editor1" rows="10">&lt;html&gt;&lt;head&gt;&lt;title&gt;CKEditor Sample&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;</textarea>
        <script type="text/javascript">
        //<![CDATA[

            CKEDITOR.replace( 'editor1',
                {
                    fullPage : true,
                    extraPlugins : 'docprops'
                });

        //]]>
        </script>
    <p>
        <input type="submit" value="Submit" />
    </p>
</form>

But it doesn't work, it just renders a normal textarea. I am using twitter bootstrap + jquery 1.7.1.

但它不起作用,它只是呈现一个普通的文本区域。我正在使用 twitter bootstrap + jquery 1.7.1。

Maybe I overlooked an important part?

也许我忽略了一个重要的部分?

enter image description here

在此处输入图片说明

回答by Gangnam

You just need to use this script

你只需要使用这个脚本

<script type="text/javascript">
    CKEDITOR.replace("editor1");
</script>

回答by sourcecode

If you get problem to setup ckeditor, may be your page load slowly . Show you need call CKEDITOR.replace("editor1"). When you use backbone.js , you will get this problem . Hope following trips will help you.

如果您在设置 ckeditor 时遇到问题,可能是您的页面加载缓慢。显示您需要调用 CKEDITOR.replace("editor1")。当你使用backbone.js时,你会遇到这个问题。希望接下来的行程能帮到你。

code

代码

 jQuery(document).ready(function() {
  CKEDITOR.replace("editor1")
 });

回答by Reed Jones

I had a similar problem, it had to do with the property CKEDITOR.basePathif you look in the console and see an error like Uncaught TypeError: Cannot set property 'dir' of undefinedthat means you have to set the basePath property to the correct location....

我有一个类似的问题,CKEDITOR.basePath如果您在控制台中查看并看到类似的错误,则它与该属性有关,Uncaught TypeError: Cannot set property 'dir' of undefined这意味着您必须将 basePath 属性设置为正确的位置....

回答by luhuiya

i have found the exact similar condition, and it looks like the element need to have id attributes in order to work

我找到了完全相似的条件,看起来元素需要具有 id 属性才能工作

回答by connect2krish

I think you need more than ckeditor.js. Add these resources as well and it should work.

我认为你需要的不仅仅是 ckeditor.js。也添加这些资源,它应该可以工作。

<link rel="stylesheet" href="assets/css/ckeditor/contents.css" rel="stylesheet">
<link rel="stylesheet" href="assets/css/ckeditor/skins/boostrap/editor.css" rel="stylesheet">
<link rel="stylesheet" href="assets/css/ckeditor/skins/boostrap/editor_gecko.css" rel="stylesheet">
<script src="assets/js/ckeditor/ckeditor.js" type="text/javascript"></script>
<script src="assets/js/ckeditor/styles.js" type="text/javascript"></script>
<script src="assets/js/ckeditor/config.js" type="text/javascript"></script>
<script src="assets/js/ckeditor/lang/en.js" type="text/javascript"></script>

回答by ajay mishra

i got solution and it works inside the controller of your view and you should post your script code inside the controller code

我得到了解决方案,它在您视图的控制器内工作,您应该在控制器代码中发布您的脚本代码

回答by Bojidar Stanchev

This is pretty much what you need when just including ckeditor.js doesn't work:

当仅包含 ckeditor.js 不起作用时,这几乎是您所需要的:

<script>
            var CKEDITOR_BASEPATH = window.location.origin + '/.../CKEditor/';
</script>

It's described in the documentation here: http://docs.ckeditor.com/#!/guide/dev_basepath

它在此处的文档中进行了描述:http: //docs.ckeditor.com/#!/guide/dev_basepath

This solved my problem when i put it in the head section of my html.

当我把它放在我的 html 的头部部分时,这解决了我的问题。

回答by Nikunj Patel

If the source path of the ckeditor.js file is not correct then you may get the error "CKEDITOR not defined". Try this.....

如果 ckeditor.js 文件的源路径不正确,那么您可能会收到错误“CKEDITOR 未定义”。尝试这个.....

 <script type="text/javascript" src="../assets/javascripts/ckeditor.js"></script>