Question

我使用了一个kendo标签条，在里面我使用了编辑器，我的编辑器是显示但它不工作，当我尝试在编辑器中写不能写.. 我已经在登录控制台，但没有任何错误.. 请解决这个问题代码： -

<div id="edit">
            <ul>
                <li >
                    Info      <--tab 1
                </li>
                <li>
                    Date      <-- Tab 2
                </li>
                <li class="k-state-active">
                    Document   <- tab 3 editor tab
                </li>
            </ul>
</div>
<div style="height:500px;">
                <div>
                     fsdfsdf
                </div>

            </div>
            <div style="height:500px;">

                <div>
                    dffsdf
                </div>
            </div>

            <div style="height:500px;">

                <div>
                    <div id="example">
    <textarea id="Description" rows="10" cols="30" style="width:100%;height:400px"></textarea>
</div>
    <script>

    $(document).ready(function () {
        $("#Description").kendoEditor({
            tools: [

                "insertImage",
                        "insertFile",
    ],
    });
    });
    </script>

                </div>
            </div>

Answer 1

它对我不起作用，我发现它是因为你的html结构。在我修复它并添加tabstrip然后kendo编辑器它工作正常。

我将你的html更改为：

 <div id="edit">
        <ul>
            <li >
                Info      <--tab 1
            </li>
            <li>
                Date      <-- Tab 2
            </li>
            <li class="k-state-active">
                Document   <- tab 3 editor tab
            </li>
        </ul>
        <div style="height:500px;">
            <div>
                 fsdfsdf
            </div>

        </div>
        <div style="height:500px;">
            <div>
                dffsdf
            </div>
        </div>

        <div style="height:500px;">
            <div>
                <div id="example">
                    <textarea id="Description" rows="10" cols="30" style="width:100%;height:400px">          </textarea>
                </div>
           </div>
       </div>
 </div>

然后是js代码：

<script>
       $("#edit").kendoTabStrip({
         animation:  {
           open: {
             effects: "fadeIn"
           }
         }
       });
       $("#Description").kendoEditor({
            tools: [
                    "insertImage",
                        "insertFile",
                    ],
       });
</script>

DEMO

Answer 2

我遇到了同样的问题。我通过在初始化KendoEditor之前简单地初始化kendoTabStrip来修复它。顺便说一句：我发现kendoTabStrip很成问题。我的意思是，盒子大小，z-index都被编码为奇怪的行为。

剑道编辑器在kendo标签条中不起作用

2 个答案: