TextArea不支持maxlength的解决办法(jquery)

  用.net 控件久了,在给一个页面的TextBox 增加控制长度的控制时,简单的加了一个maxlength='xxx' 就行,可是测试确总是不过,原因是设置了多行模式,在这样的情况下生成的html代码就是textarea,同时maxlength属性就没有被增加上,因为IE不支持textarea 的 maxlength属性,于是,在firefox 6中测试,发现firefox是支持这个属性的。那么就简单了。自己写了一个jquery的扩展,这样就可以很容易实现对textarea控制最大长度了。

  扩展代码如下:

  

复制代码 代码如下:

  (function($){

  $.fn.textarealimit = function(settings) {

  settings = jQuery.extend({

  length:1000

  }, settings);

  maxLength =settings.length;

  $(this).attr("maxlength",maxLength).bind("keydown",doKeydown).bind("keypress",doKeypress).bind("beforepaste",doBeforePaste).bind("paste",doPaste);

  function doKeypress()

  {

  var oTR = document.selection.createRange()

  if(oTR.text.length >= 1)

  event.returnValue = true

  else if(this.value.length > maxLength-1)

  event.returnValue = false

  }

  function doKeydown()

  {

  var _obj=this;

  setTimeout(function()

  {

  if(_obj.value.length > maxLength-1)

  {

  var oTR = window.document.selection.createRange()

  oTR.moveStart("character", -1*(_obj.value.length-maxLength))

  oTR.text = ""

  }

  },1)

  }

  function doBeforePaste()

  {

  event.returnValue = false

  }

  function doPaste()

  {

  event.returnValue = false

  var oTR = document.selection.createRange()

  var iInsertLength = maxLength - this.value.length + oTR.text.length

  var sData = window.clipboardData.getData("Text").substr(0, iInsertLength)

  oTR.text = sData;

  }

  }

  })(jQuery);

  以上只是针对IE控制了复制粘贴的控制以及输入时控制,由于使用IE的特性,这些方法在firefox中是无效的。

  调用代码:

  

复制代码 代码如下:

  $(document).ready(function() {

  $("#ctl00_ZiiOContent_ucQuestionnaire_txtquestion4_2").textarealimit();

  });