Kendo UI Editor最大和最小字符

Question

我正在使用Kendo UI編輯器的MVC擴展。是否有一個選項可以設置排除HTML內容的最小字符數和最大字符數。

我使用了StringLength屬性，但包含HTML內容。

Answer 1

你是對的關於劍道編輯沒有這些選項。有可能通過一些JavaScript和jQuery來做到這一點。這個例子是使用Kendo Core（Kendo包裝器如ASP.NET MVC應該仍然可以在ASP.NET MVC中工作，而不是在JavaScript中調用$（「＃editor」）。kendoEditor（）。我的jsFiddle example。

HTML：

<h3 class="text-primary">Text Only Count: <span id="textCount"></span></h3> 
<div id="example"> 
    <textarea id="editor" rows="10" cols="30" style="height:440px"> 
     <p>Kendo UI Editor allows your users to edit HTML in a familiar, user-friendly way. 
      <br />In this version, the Editor provides the core HTML editing engine, which includes basic text formatting, hyperlinks, lists, and image handling. The widget <strong>outputs identical HTML</strong> across all major browsers, follows accessibility standards and provides API for content manipulation.</p> 
     <p>Features include:</p> 
     <ul> 
      <li>Text formatting & alignment</li> 
      <li>Bulleted and numbered lists</li> 
      <li>Hyperlink and image dialogs</li> 
      <li>Cross-browser support</li> 
      <li>Identical HTML output across browsers</li> 
      <li>Gracefully degrades to a <code>textarea</code> when JavaScript is turned off</li> 
     </ul> 
    </textarea> 
</div> 

CSS：

.warning { color: red; } 

的JavaScript：

$(function() { 
    $("#editor").kendoEditor(); 
    var minChar = 100; 
    var maxChar = 600; 
    var iframe = $("iframe"); 

    // Change event for iframe body content 
    iframe.contents().find("body").on('keydown', function (e) { 
     //Clean up 
     $("#textCount").removeClass("warning"); 

     // Get Body (.text() strips out HTML tags) 
     var data = $(this).text(); 
     if (this.which < 32) { 
      return; // Do nothing 
     } 

     var isEditKey = (e.keyCode == 8 || e.keyCode == 46); 

     if (data.length == maxChar && !isEditKey) { 
      e.preventDefault(); 
     } else if (data.length > maxChar) { 
      // Maximum exceeded 
      $(this).text(data.substring(0, maxChar)); 
     } else if (data.length < minChar) { 
      $("#textCount").addClass("warning"); 
     } 
     $("#textCount").text(data.length); 
    }); 

    // OnLoad call to get starting count 
    var data = iframe.contents().find("body").text(); 
    $("#textCount").text(data.length); 
});