0

ここにある ckeditor チュートリアルを使用して、wswgs に変換されたテキスト領域の一部に単語カウント機能を実装しようとしています: http://www.n7studios.co.uk/2010/03/01/ckeditor-word-カウントプラグイン/ . このチュートリアルでは、カスタム プラグインを使用して、ckeditor の単語をカウントします。単語数は正しいのですが、許可されている最大単語数を超えたときに色が赤に変わるのを確認できません。ckeditor を使用して wswg に変換した後、テキスト領域がどのように見えるかを確認するために firebug を使用しましたが、奇妙なことは何も表示されません。これが私のコードです：

<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>

画面は次のとおりです。

wordcount プラグインを使用した ckeditor

どんな助けでも大歓迎です。

4

1 に答える 1

0

私はついにそれを理解しました。Html.TextAreaFor()asp.net mvc ヘルパー メソッドは、上記の質問コードに示されているように、html 属性のオブジェクトをパラメーターとして受け取ります。私は元々、テキストエリアに「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 を掘り下げて、すべてがブラウザー上でどのようにレンダリングされるかを調べるのに非常に役立ちました。

于 2012-04-20T18:10:52.057 に答える