CCP Review-Javascript

CCP Review-Javascript
1、对于div中的input标签，如果div的style.display属性为'none'，那么调用input标签的focus方法在IE6.0上会报错，首先应该让其display属性为''或者'block'再调用；
2、当HTML元素的name属性唯一时可以利用document.getElementById()调用获得这个元素；
3、如果异步提交耗时较长，可在异步提交之前显示等待提示，在回调函数中根据返回值更新提示；
4、在JS中function也是可以作为变量的，所以我们可以在自己封装的框架中预留回调函数供自定义使用，如下面的代码：

 1  // common.js
 2  var  callback  =   null ;
 3  function  commonUse(){
 4    
 5     if ( typeof (callback)  ==   " function " ){
 6      callback();
 7    }
 8    
 9  }
10 
11  // self.js
12  function  selfUse(){
13    
14    callback  =   function (){
15       // do something before
16    }
17    commonUse();
18    
19  }

5、JS中可以使用正则表达式来校验数字域、日期域和EMail等。代码示例如下：
校验日期的例子：

 1       function  isDate(date){
 2           // 对日期格式进行验证 要求为2000-2099年  格式为 yyyy-mm-dd 并且可以正常转换成正确的日期
 3           var  regex =/^ ( 19 | 20 )\d{ 2 } - (( 0 [ 1 - 9 ]{ 1 }) | ( 1 [ 0 - 2 ]{ 1 })) - (( 0 [ 1 - 9 ]{ 1 }) | ([ 1 - 2 ]{ 1 }[ 0 - 9 ]{ 1 }) | ( 3 [ 0 - 1 ]{ 1 }))$ / ;
 4          
 5           if ( ! regex.test(date)){
 6               return   false ;
 7          }
 8           var  arr_ = date.split( " - " );
 9           var  tmp  =   new  Date(arr_[ 0 ], parseFloat(arr_[ 1 ]) - 1 , parseFloat(arr_[ 2 ]));
10           if (tmp.getFullYear() != parseFloat(arr_[ 0 ]) 
11               ||  tmp.getMonth() != parseFloat(arr_[ 1 ]) - 1  
12               ||  tmp.getDate() != parseFloat(arr_[ 2 ])){
13               return   false ;
14          }
15           
16            return   true ;
17      }

  这篇文章有详细的说明： http://www.blogjava.net/byterat/archive/2006/12/20/89143.html
  这本电子书是讲解正则表达式的： http://www.blogjava.net/Files/kawaii/RegularExpressions.zip 
6、在JS编码中，如果代码量较大，要注意防止function名称重复，包括直接在页面上编写的和引用外部JS文件的，不然会出现一些莫名奇妙的问题；
7、注意JS代码中的函数返回语句return的使用；
8、尽量把JS代码写在外部公共的文件中，而在页面中引入，好处有：a.函数复用；b.JS文件缓存；c.提供页面解析速度。基于b，我们在修改JS代码后，要看IE的设置是否将原先的JS文件缓存造成问题；
9、对于同一个页面的多个表单提交，我们可以在第一个表单中设置相应的隐藏域，在表单提交之前利用JS脚本把其他表单的数据设置到第一个表单的隐藏域中；
10、对于异步校验的文本框，我们一般设置触发事件为onblur而不是onchange或者onpropertychange，以减少客户端和服务器的交互次数，但应该注意如果这个文本框最初没有获得焦点，那么onblur就不会触发，可以先调用以下onfocus，再调用onblur手动触发；
11、JS中不存在trim()函数，自定义如下：

 1  // JS去除首尾空格（同VBS的Trim)
 2       function  trim(inputString) {   
 3           if  ( typeof  inputString  !=   " string " ) {
 4               return  inputString; 
 5          }
 6           var  retValue  =  inputString;
 7           var  ch  =  retValue.substring( 0 ,  1 );
 8           while  (ch  ==   "   " ) {
 9                  // 检查字符串开始部分的空格
10              retValue  =  retValue.substring( 1 , retValue.length);
11              ch  =  retValue.substring( 0 ,  1 );
12          }
13          ch  =  retValue.substring(retValue.length - 1 , retValue.length);
14           while  (ch  ==   "   " ) {
15               // 检查字符串结束部分的空格
16              retValue  =  retValue.substring( 0 , retValue.length - 1 );
17              ch  =  retValue.substring(retValue.length - 1 , retValue.length);
18          }
19           while  (retValue.indexOf( "    " )  !=   - 1 ) {
20               // 将文字中间多个相连的空格变为一个空格
21              retValue  =  retValue.substring( 0 , retValue.indexOf( "    " )) 
22                   +  retValue.substring(retValue.indexOf( "    " ) + 1 , retValue.length);
23          }
24           return  retValue;
25      }

12、JS中显示模式窗口，代码如下：

 1  function  showMyDialog(){
 2     var  dialogProperty  =  'dialogWidth:800px;dialogHeight:600px;status:no';
 3     var  windowProperty  =   " height=800,width=800,status=no,toolbar=no,menubar=yes,location=yes,resizable=yes,scrollbars=yes " ;
 4 
 5     var  url  =   " SomeAction.do?id= " + id + " &flag=true " ;
 6     var  returnVal  =  window.showModalDialog(url, "" , dialogProperty);
 7     if ( typeof (returnVal)  ==   " undefined " ){
 8       return ;
 9    }
10     if (returnVal  !=    "" ){
11       // do something   
12    }
13  }
14 

在新打开的模式窗口中，我们通过 window.returnValue设置返回值，然后在父页面中我们通过returnVal可以拿到返回值。