首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >CKEditor ReadOnly

CKEditor ReadOnly
EN

Stack Overflow用户
提问于 2013-04-26 20:58:56
回答 7查看 19.7K关注 0票数 5

因为我使用CKEditor (http://ckeditor.com/),所以我遇到了一个问题。问题是我找不到一种方法来使编辑器成为ReadOnly,而且我不能只使用文本区,因为我想保持一致性。我已经在StackOwerflow上看到过很多这样的问题,但没有一个有效或者太老了。

到目前为止,我的代码只是显示/初始化编辑器:

代码语言:javascript
复制
$(document).ready(function(){
    CKEDITOR.replace( 'ckeditor', {
        on: {
            // Check for availability of corresponding plugins.
            pluginsLoaded: function( evt ) {
                var doc = CKEDITOR.document, ed = evt.editor;
                if ( !ed.getCommand( 'bold' ) )
                    doc.getById( 'exec-bold' ).hide();
                if ( !ed.getCommand( 'link' ) )
                    doc.getById( 'exec-link' ).hide();
            }
        }
    });
});

我使用最新的CKEditor版本(v.4.1.1全包)

提前感谢!:)

EN

回答 7

Stack Overflow用户

发布于 2013-04-26 21:04:10

在docs readOnly中,您可以将配置设置为readOnly

代码语言:javascript
复制
config.readOnly = true;

还有一个example,它显示通过一个方法设置它

代码语言:javascript
复制
editor.setReadOnly( true);
票数 9
EN

Stack Overflow用户

发布于 2014-07-10 00:01:30

尝试使用以下代码行,

代码语言:javascript
复制
<textarea id="editor1" name="editor1" ></textarea>
<textarea id="editor2" name="editor2" ></textarea>

<input type="button" onclick="EnableEditor2()" value="EnableEditor2" />

<script>
      $(document).ready(function () {

         //set editor1 readonly
         CKEDITOR.replace('editor1', {readOnly:true});
         CKEDITOR.replace('editor2');

         //set editor2 readonly
         CKEDITOR.instances.editor2.config.readOnly = true;

      });

      function EnableEditor2() {
         CKEDITOR.instances.editor2.setReadOnly(false);
      }
</script>
票数 5
EN

Stack Overflow用户

发布于 2013-04-26 21:05:08

你试过this吗?

他们说,这应该是可行的

代码语言:javascript
复制
var editor;

// The instanceReady event is fired, when an instance of CKEditor has finished
// its initialization.
CKEDITOR.on( 'instanceReady', function( ev )
{
    editor = ev.editor;

    // Show this "on" button.
    document.getElementById( 'readOnlyOn' ).style.display = '';

    // Event fired when the readOnly property changes.
    editor.on( 'readOnly', function()
        {
            document.getElementById( 'readOnlyOn' ).style.display = this.readOnly ? 'none' : '';
            document.getElementById( 'readOnlyOff' ).style.display = this.readOnly ? '' : 'none';
        });
});

function toggleReadOnly( isReadOnly )
{
    // Change the read-only state of the editor.
    // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#setReadOnly
    editor.setReadOnly( isReadOnly );
}

和html

代码语言:javascript
复制
<form action="sample_posteddata.php" method="post">
    <p>
        <textarea class="ckeditor" id="editor1" name="editor1" cols="100" rows="10">&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;</textarea>
    </p>
    <p>
        <input id="readOnlyOn" onclick="toggleReadOnly();" type="button" value="Make it read-only" style="display:none" />
        <input id="readOnlyOff" onclick="toggleReadOnly( false );" type="button" value="Make it editable again" style="display:none" />
    </p>
</form>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16237093

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档