阳光365--路是靠自己走的，但要有眼光有胆略有信心!

  最近做项目时，遇到要控制多行文本框输入内容的长度问题，假如长度限制在1000以内，如果是单行的话，设置下maxlength属性就OK了，但对于多行文本框来说就不起作用了。怎么办呢，只能利用脚本来控制了。在网上搜了点资料，查到了相关的JS函数，比较凌乱，用起来也不太方便，主要是触发了以下几个事件!
1、onkeypress，2、onkeydown，3、onbeforepaste，4、onpaste 均用来验证输入或者粘贴内容的长度是不是已经超过限制，如果 是的话，就取消当前的操作。
但是这此方法都要在文本框的HTML语言中一一写入相应的触发事件，代码多且用起来也不方便。所以就想起来把这些函数封装成一个JS类，不就好了么。
下面就是普通的JS类的完整代码：

//以下是封装好的JS类。正确的验证多行文本框的长度问题
在这里涉及到JS类和函数体对this的使用问题，也就是在javascript中的this指针的用法。

//javascript普通类的写法 //////////////////////////////              
function areaJS()
{
      //javascript中的this的用法
    this.maxLength;
    this.element;
    var parentThis=this; //指向的是areaJS    
    this.Init=function (varMaxLenth,varID){          
        parentThis.maxLength=varMaxLenth;
        parentThis.element =document.all[varID];
        parentThis.element.attachEvent("onkeypress",parentThis.doKeypress);
        parentThis.element.attachEvent("onkeydown",parentThis.doKeydown);           parentThis.element.attachEvent"onbeforepaste",parentThis.doBeforePaste);
        parentThis.element.attachEvent("onpaste",parentThis.doPaste);
    };

    this.doKeypress=function ()
    {
        if(!isNaN(parentThis.maxLength))
        {
              parentThis.maxLength = parseInt(parentThis.maxLength);
              var oTR = parentThis.element.document.selection.createRange();
              if(oTR.text.length >= 1)
                      event.returnValue = true;
              else if(parentThis.element.value.length > parentThis.maxLength-1)
                      event.returnValue = false;
        }
    };

    this.doKeydown=function ()
    {
        setTimeout(function()
        {
              parentThis.maxLength = parseInt(parentThis.maxLength);
              if(!isNaN(parentThis.maxLength))
              {
                  if(parentThis.element.value.length > parentThis.maxLength-1)
                  {//超过了指定的范围，则重新定位开始的位置，并清空。
                  //比如 oTR="123456";而我们只能输入4位，则oTR.moveStart("character",-1*(6-4))--->oTR.moveStart("character",-2) 移去2位，就剩下“1234”
                      var oTR = window.document.selection.createRange();
                      oTR.moveStart("character", -1*(parentThis.element.value.length-parentThis.maxLength))
                      oTR.text = "";
                  }
              }
        },1)
    };

    this.doBeforePaste=function ()
    {
        if(!isNaN(parentThis.maxLength))//如果为真的话，就执行源对象上的操作，否则取消源对象上的操作
                  event.returnValue = false;
    };

    this.doPaste=function ()
    {
        if(!isNaN(parentThis.maxLength))
        {
              event.returnValue = false;
              parentThis.maxLength = parseInt(parentThis.maxLength);
              var oTR = parentThis.element.document.selection.createRange();
              var iInsertLength = parentThis.maxLength - parentThis.element.value.length + oTR.text.length;
              //截断字符
              var sData = window.clipboardData.getData("Text").substr(0, iInsertLength);
              oTR.text = sData;
        }
    };
}
下面测试下JS类，是不是能有效的控制文本框内容的长度问题

<textarea rows="4" cols="30" id="aa" NAME="aa"></textarea>
<script language=javascript>
var aa=new areaJS();
aa.Init(5,"aa");
alert('普通JS类调用，文本框被限制的长度为：'+aa.maxLength);

经过测试成功!!!!!但这样还是需要声明一个类的对象，能不能再省点事呢？？于是我又想起能不能做个JS的静态类呢。经过查相关的资料，终于写出来了。呵呵

///////////javascript静态类的写法//////////////////////////////
//静态类的名称--ChkMaxLen
function ChkMaxLen() {           }
//静态类的变量列表--ChkMaxLen
    ChkMaxLen.maxLength=0;
    ChkMaxLen.element=null;  
//静态类的函数列表--ChkMaxLen
ChkMaxLen.Init=function (varMaxLenth,varID){

    ChkMaxLen.maxLength=varMaxLenth;
    ChkMaxLen.element =document.all[varID];
    ChkMaxLen.element.attachEvent("onkeypress",ChkMaxLen.doKeypress);
    ChkMaxLen.element.attachEvent("onkeydown",ChkMaxLen.doKeydown);
    ChkMaxLen.element.attachEvent("onbeforepaste",ChkMaxLen.doBeforePaste);
    ChkMaxLen.element.attachEvent("onpaste",ChkMaxLen.doPaste);
};

ChkMaxLen.doKeypress=function ()
{
    if(!isNaN(ChkMaxLen.maxLength))
    {
        ChkMaxLen.maxLength = parseInt(ChkMaxLen.maxLength);
        var oTR = ChkMaxLen.element.document.selection.createRange();
        if(oTR.text.length >= 1)
                  event.returnValue = true;
        else if(ChkMaxLen.element.value.length > ChkMaxLen.maxLength-1)
                  event.returnValue = false;
    }
};

ChkMaxLen.doKeydown=function ()
{
    setTimeout(function()
    {
        ChkMaxLen.maxLength = parseInt(ChkMaxLen.maxLength);
        if(!isNaN(ChkMaxLen.maxLength))
        {
              if(ChkMaxLen.element.value.length > ChkMaxLen.maxLength-1)
              {//超过了指定的范围，则重新定位开始的位置，并清空。
              //比如 oTR="123456";而我们只能输入4位，则oTR.moveStart("character",-1*(6-4))--->oTR.moveStart("character",-2) 移去2位，就剩下“1234”
                  var oTR = window.document.selection.createRange();
                  oTR.moveStart("character", -1*(ChkMaxLen.element.value.length-ChkMaxLen.maxLength))
                  oTR.text = "";
              }
        }
    },1)
};

ChkMaxLen.doBeforePaste=function ()
{
    if(!isNaN(ChkMaxLen.maxLength))//如果为真的话，就执行源对象上的操作，否则取消源对象上的操作
              event.returnValue = false;
};

ChkMaxLen.doPaste=function ()
{
    if(!isNaN(ChkMaxLen.maxLength))
    {
        event.returnValue = false;
        ChkMaxLen.maxLength = parseInt(ChkMaxLen.maxLength);
        var oTR = ChkMaxLen.element.document.selection.createRange();
        var iInsertLength = ChkMaxLen.maxLength - ChkMaxLen.element.value.length + oTR.text.length;
        //截断字符
        var sData = window.clipboardData.getData("Text").substr(0, iInsertLength);
        oTR.text = sData;
    }
};
测试以上两个类
<textarea rows="4" cols="30" id="aa" NAME="aa"></textarea>
<script language=javascript>
var aa=new areaJS();
aa.Init(5,"aa");
alert('普通JS类调用，文本框被限制的长度为：'+aa.maxLength);

ChkMaxLen.Init(5,"aa");
alert('静态JS类调用，文本框被限制的长度为：'+ChkMaxLen.maxLength);</script>

哈哈，OK!!!!!!