CLEditor - 如果达到最大长度,则失去焦点

时间:2011-09-07 08:14:36

标签: javascript jquery wysiwyg cleditor

我正在尝试为CLEditor重新创建一个maxlength函数。目标是: 如果文本输入文本框并且其长度超过设置的maxlength,则文本框应该失去焦点,以便不可能再写任何字母。

到目前为止我所获得的是CLEditor识别文本何时超过我的maxlength。 为了失去焦点,我尝试了一个简单的返回(即return; return false;)和一些.blur() - 方法(即$(frameDesc).blur();和cledDesc。$ area.blur();)。 但那些不起作用。即使达到最大长度,我仍然可以填写文本。

请查看代码:

$("#profileForm_description").cleditor({width: 430, height: 125});

var cledDesc = $("#profileForm_description").cleditor()[0];
var frameDesc =  cledDesc.$frame[0].contentWindow.document;

$(frameDesc).bind('keypress change', function(){

   var text = textWithoutHTML(cledDesc.$area.val());

   if(text.length >= 650){
      console.log("Longer than MaxLength");
      //lose focus

   }else{
      //Do something
   }
});

任何帮助和提示将不胜感激:)

2 个答案:

答案 0 :(得分:1)

解决了这个问题。这非常棘手。解决方案(对我来说)是:

使用keydown而不是keypress - 事件。

因此,如果我试图在文本框中放入一些文本并达到maxlength,我就无法继续写作了。但是为了能够删除一些文本,除了Backspace-key之外我还需要被拒绝。如果按下的键是退格键,我就进行检查。

这就是代码现在的样子:

$("#profileForm_description").cleditor({width: 430, height: 125});

var cledDesc = $("#profileForm_description").cleditor()[0];
var frameDesc =  cledDesc.$frame[0].contentWindow.document;

$(frameDesc).bind('keydown change', function(event){

   var text = textWithoutHTML(cledDesc.$area.val());

   if(text.length >= 650 && event.which != 8){
      console.log("Longer than MaxLength");
      //lose focus / stop writing
      return false;
   }else{
      //Do something
   }
});

答案 1 :(得分:1)

我添加了一些代码以使其正常工作。

  1. 我甚至抓住了“canc”键(和其他人)
  2. 在检查文本的长度之前,我更新了textarea,看起来CLEditor有一个内部缓存,删除和重新输入文本后我有一个奇怪的行为。
  3. 这对我来说非常有用:

    var cledDesc = $("#oodsummary").cleditor()[0];
    var frameDesc =  cledDesc.$frame[0].contentWindow.document;
    var limit = 10;
    $(frameDesc).bind('keydown', function(event){
        cledDesc.updateTextArea();
    
        var text = cledDesc.$area.val();
    
        if(text.length >= limit &&
            event.which != 8 && // back
            event.which != 46 && // canc
            event.which != 37 && // left
            event.which != 38 && // up
            event.which != 39 && // right
            event.which != 16 && // shift
            event.which != 20 && // caps lock
            event.which != 91 && // os special
            event.which != 18 // alt
            ) {
            alert("Il testo inserito risulta essere troppo lungo.");
            cledDesc.$area.val(text.substr(0, limit)).blur(); 
            return false;
        }else{
            cledDesc.updateTextArea();
            return true;
        }
    });