ckediter配备文本框限制字符数

时间:2016-05-19 13:36:05

标签: c# asp.net ckeditor

虽然有几个较旧的问题触及了这个主题,但它们并不处理webforms,这是我正在工作的地方,代码似乎没有开始。

在需要收集rtf数据的ASP.NET Web表单应用程序中,我使用ckeditor启用了几个字段以允许rtf输入(存储为html)。在其中一些领域,我需要一种限制输入的方法。

要在表格/表格中加以限制的

元素:

<tr>
    <td>
        <asp:Label ID="LabelResponseA" runat="server">Response A</asp:Label>
    </td>
    <td>
        <asp:TextBox ID="ResponseA" Columns="50" Rows="2" TextMode="MultiLine" 
            runat="server" CssClass="ckeditor"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" 
            Text="* Response A Required" ControlToValidate="ResponseA" 
            SetFocusOnError="true" Display="Dynamic"></asp:RequiredFieldValidator>
    </td>
</tr>

限制字符的javascript代码块:

</script>
<script type="text/javascript">
 $(function() {            
        $("[id$=ResponseA]").on('key',function(event){
            var deleteKey = 46;
            var backspaceKey = 8;
            var keyCode = event.data.keyCode;
            if (keyCode === deleteKey || keyCode === backspaceKey)
                return true;
            else
            {
                var textLimit = 50;
                var str = $("[id$=ResponseA]").getData();
                if (str.length >= textLimit)
                    return false;
            }
        });    
    });
</script>

1 个答案:

答案 0 :(得分:1)

您可以使用editor "key" event并检查编辑器的正文文本长度。

如果您的编辑器的textarea名为ResponseA

var textLimit = 50;

CKEDITOR.instances.ResponseA.on('key', function (evt) {
    if (CKEDITOR.instances.ResponseA.document.getBody().getText().length > textLimit) evt.cancel();
});

您可以进一步扩展此裸骨示例以满足您的需求。