Question

我正在尝试使用此处的ckeditor教程在我的一些已转换为wswgs的文本区域上实现字数统计功能：http://www.n7studios.co.uk/2010/03/01/ckeditor-word-count-plugin/。本教程使用自定义插件来计算ckeditor的单词。我得到了正确的字数，但是当我超过允许的最大字数时，我无法看到颜色变为红色。我使用了firebug来看看我的文本区域在使用ckeditor转换为wswg之后的样子，但我没有看到任何奇怪的东西。这是我的代码：

<asp:Content ID="Content3" ContentPlaceHolderID="JSContent" runat="server">
<script src="<%: Url.Content("~/Scripts/jquery-1.7.min.js") %>" type="text/javascript"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.combobox.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/ckeditor/ckeditor.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/ckeditor/adapters/jquery.js") %>"></script> <%-- Must be linked last --%>
<script type="text/javascript">
    $(document).ready(function () {

        $(".cke_editor").ckeditor({
            toolbar: 'custom'
        });

    });

<div class="form-row form-row-inline">
    <%: Html.TextAreaFor(model => model.AssignmentText, new { @name = "table", @class = "cke_editor", @style = "display:none", @onchange = "setDirty(true)" })%>
    <input name="tableWordCount" type="hidden" value="10" />
</div>

这是屏幕：

ckeditor with the wordcount plugin

非常感谢任何帮助。

Answer 1

我终于明白了。 Html.TextAreaFor() asp.net mvc helper方法作为参数获取html属性的对象，如上面的问题代码所示。我最初使用textarea的“name”属性，以便它匹配ckeditor字数插件上的“name属性”。我不得不使用“id”属性。

ckeditor示例：

<html>
<head>
    <title>CKEditor Word Count Demonstration</title>
    <script type="text/javascript" src="jquery/jquery.1.4.min.js"></script>
    <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
</head>

<body>
    <form action="#" method="POST">
        <p>
            <label for="content">Content with 250 word limit</label>
            <textarea name="content" class="ckeditor">Lorem Ipsum.</textarea>
            <input type="hidden" name="contentWordCount" value="250" />
        </p>
    </form>
</body>
</html>

我的新固定代码：

<asp:Content ID="Content3" ContentPlaceHolderID="JSContent" runat="server">
<script src="<%: Url.Content("~/Scripts/jquery-1.7.min.js") %>" type="text/javascript"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.combobox.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/ckeditor/ckeditor.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/ckeditor/adapters/jquery.js") %>"></script> <%-- Must be linked last --%>
<script type="text/javascript">
    $(document).ready(function () {

        $(".cke_editor").ckeditor({
            toolbar: 'custom'
        });

    });

<div class="form-row form-row-inline">
    <%: Html.TextAreaFor(model => model.AssignmentText, new { @id = "taxta", @class = "cke_editor", @style = "display:none", @onchange = "setDirty(true)" })%>
    <input name="taxtaWordCount" type="hidden" value="10" />
</div>

所以，我唯一要改变的是“id”属性。我希望这有助于其他人。同样，Firebug非常有助于深入研究html DOM并查看浏览器上所有内容的呈现方式。

ckeditor上最大插件数量问题

1 个答案: