利用JS为页面元素添加事件

        今天需要为项目所有的页面可编辑input框增加空字符串过滤功能，利用正则表达式很容易实现内容的过滤，但是项目有上百个页面，每个页面也有20左右的input框，如果一个一个的加事件的话，估计后半生都没了，如何在不改动现有页面的前提下，又能实现目标呢？想到了在页面解析的时候用JS去动态的为这些输入框增加事件，并且还要保留原事件，只要想到了，一定能做到，doit。下面是实现的代码。

       

function trimInputs(){ 
   var o=document.getElementsByTagName("input");
   for(var i=0;i <o.length;i++){
    if(o[i].type=="text"&& !o[i].disabled && !o[i].readOnly){//只对可编辑的输入框添加过滤功能 
      o[i].attachEvent("onblur",function(obj){ return function() 
                   {obj.value=(obj.value).replace(/\s/g,"");} }(o[i]));//闭包传参     } 
      } 

} 
window.attachEvent("onload",trimInputs);//如果页面少的话，从性能考虑可以写在调用页面里，不要写在公共JS里面

 

 

 因为所有的页面几乎都需要增加这样的功能因此就把这段功能直接加到项目的公共JS，进入页面测试下完全达到预期效果，哎，不过那个闭包传参研究了好大会，看来以后还要加紧对闭包的学习。

 

        上面的只是为项目需求而写的特定代码，稍微修改下可以适合多种情况。为实现这个功能又特意的温习下正则表达式，修改了以前系统里面对数字的验证方法，数字正则表达式：

     

function test(obj){
          
      if(obj.value.match(/^-?\d*(\.)?\d+$/)){
                  alert("匹配");
         }else{ alert("不匹配"); } 
}

 

 

BWT:闭包在IE下容易引起内存的泄露，如果页面比较复杂的话，可以用下面的代码来代替闭包

function demo(){ 
      //IE下是srcElement ，FF下是target 
     var obj=event.srcElement ? event.srcElement : event.target; 
     //do something for obj 
}