Question

我正在使用带有BootstrapCK4的CKEditor 4。我在我的ASP.NET MVC项目中使用它。当我用CKEditor打开页面时，我只看到一个大的灰色空白而不是正常显示的编辑器。就像那样：

enter image description here

我的代码的HTML输出：

<html>
<head>
    <title>YaziEkle</title>
     <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script src="/Scripts/bootstrap.min.js" type="text/javascript"></script>
    <style>
       @import "/Content/admin.css"
    </style>

    <script src="/ckeditor/ckeditor.js"></script>

</head>
<body>
    <div class="kapsayici">
        <div class="wrapper">
<ul class="menu">
<li class="anasayfa-m"><a href="">Anasayfa</a></li>
<li class="yazilar-m"><a href="">Yazılar</a></li>
<li class="kategoriler-m"><a href="">Kategoriler</a></li>
<li class="sayfalar-m"><a href="">Sayfalar</a></li>
<li class="gorunum-m"><a href="">Görünüm</a></li>
<li class="yorumlar-m"><a href="">Yorumlar</a></li>
<li class="kullanicilar-m"><a href="">Kullanıcılar</a></li>
</ul><br />
</div>

<form id="form">

    <select data-val="true" data-val-required="Kategori seçilmelidir." id="Kategori" name="Kategori"><option value="1">kk</option>
<option value="2">kk</option>
<option value="3">kk</option>
</select>
     <input class="form-control" data-val="true" data-val-maxlength="Baslik alanı, uzunluğu en fazla &#39;-1&#39; olan bir dize veya dizi türü olmalıdır." data-val-maxlength-max="-1" data-val-required="Başlık boş bırakılamaz." id="Baslik" name="Baslik" placeholder="Başlık" type="text" value="" />  
    <label class="control-label" for="inputError"><span class="field-validation-valid" data-valmsg-for="Baslik" data-valmsg-replace="true"></span></label>
     <textarea cols="20" data-val="true" data-val-maxlength="Icerik alanı, uzunluğu en fazla &#39;-1&#39; olan bir dize veya dizi türü olmalıdır." data-val-maxlength-max="-1" data-val-required="İçerik boş bırakılamaz" id="yaziekle" name="Icerik" rows="2">
</textarea> 
    <label class="control-label" for="inputError"><span class="field-validation-valid" data-valmsg-for="Icerik" data-valmsg-replace="true"></span></label>
</form>
    <script>
            CKEDITOR.replace("yaziekle",
                {
                    width: "61.5%",
                }
                );
    </script>
    </div>
</body>
</html>

编辑：小提琴：http://jsfiddle.net/Swr9K/1/

这个问题的原因是什么？我怎么解决？提前谢谢。

Answer 1

删除width属性将显示ckEditor面板。

Answer 2

我认为你缺少CKEditor的jQuery适配器。像这样：

<script src="@Url.Content("~/Scripts/ckeditor/adapters/jquery.js")" type="text/javascript"></script>

你应该在你的CKEditor安装文件夹中找到这个js文件。

CKEditor灰色区域问题

2 个答案: