JavaScript编程笔记

更新中……

1、数据类型验证问题

  Asp.Net虽然有验证控件，但是有些复杂的验证还是得传到服务器上进行，用js速度和性能都比较好
<script>
 //检查是否为任意数（实数）
function isNumeric(strNumber) {
var newPar=/^(-|\+)?\d+(\.\d+)?$/
alert(newPar.test(strNumber)); }
 //检查是否为正数
function isUnsignedNumeric(strNumber) {
var newPar=/^\d+(\.\d+)?$/
alert(newPar.test(strNumber)); }
//检查是否为整数
function isInteger(strInteger) {
var newPar=/^(-|\+)?\d+$/
alert(newPar.test(strInteger)); }
//检查是否为正整数
function isUnsignedInteger(strInteger) {
var newPar=/^\d+$/
alert(newPar.test(strInteger)); }
</script>

2、asp.net中用alert（）实现换行问题

     asp.net中用response.Write("<script>alert('提示：\n操作出错！');</script>");无法执行。
     将字符串写成
     say="提示：\\n操作出错！"
     say=@"提示：\n操作出错！"
  
 3、js实现刷新验证码

     单击图片刷新：
<img id="CheckImg" src="CreatImage.aspx" onclick="this.src='CreatImage.aspx?temp='+Math.random()"/>
     单击“刷新验证码”按钮刷新
    function imagechick()
   {
     form1.CheckImg.src="CreatImage.aspx?temp="+Math.random();
     return false;//不上传到服务器
   }
     其中CreatImage.aspx为产生验证码图片的页面，源码见：C#产生图形验证码

4、js中使用正则表达式的方法

    格式是：/正则表达式/
    必须用两个斜杠把正则表达式括起来。

   如非法字符检测正则表达式为：^(?:[\u4e00-\u9fa5]*\w*\s*)+$
   使用的代码为：
      var newPar=/^(?:[\u4e00-\u9fa5]*\w*\s*)+$/;
      if(newPar.test("1234&1238*_~"))
      {
             alert("不含非法字符！");
      }
     else
      {
             alert("含有非法字符！");
      }

5、js中如何调用DropDownList控件选中的项

 var tt_type=document.getElementById("DropDownList1").value;


6、文本框回车触发按钮事件

 function document.onkeydown() 
{ 
     var e=event.srcElement; 
     if(e==document.getElementById("文本框id")&&event.keyCode==13) 
    { 
           document.getElementById("需要点击的那个按钮的id").click(); 
           return false; 
     } 
} 

7、打印部分网页

      将需要打印的网页部分放在div里面（id为printArea）

      function printIt()
      {
        var printArea=window.document.all.printArea;
        window.document.body.innerHTML=printArea.innerHTML;
        window.print();
     }

    其他不需要打印的部分放在printArea的DIV外面
    如“打印”，“关闭”等按钮
    “打印”按钮的单击事件：<a href="#" onclick="printIt()">打印</a>
    “关闭”按钮的单击事件：<a href="#" onclick="window.close();">关闭</a>

8、操作listBox控件
   
      将选中的项显示在TextBox里：
       function SelectOne()
      {
        var list=document.getElementById("ListBox1");
        var text=document.getElementById("TextBox1");
        var selectIndex=list.selectedIndex;
        if(selectIndex<0)
           return;
        text.value=list.options[selectIndex].text;
      }
     
      选择一个list的全部到另一个list：
      function SelectAll()
        {
            var lst1=window.document.getElementById("SourceListBox");
            var length = lst1.options.length;
            for(var i=0;i<length;i++)
            {
                var v = lst1.options[i].value;
                var t = lst1.options[i].text;
                var lst2=window.document.getElementById("DestinationListBox");
                lst2.options[i] = new Option(t,v,true,true);    
            } 
         }

9、获取昨天的时间
   function selectYesterday()
    {
       var d=new Date();
       d.setDate(d.getDate()-1); 
       var t1=document.getElementById("time1");
       t1.value=d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate();
    }

10、将某textBox禁用

             document.getElementById("textBox1").readOnly=true;
             document.getElementById("textBox1").disabled=true;

11、点击某单词，让其高亮显示

<script language="javaScript"> 
function selectMe() {
    var r=document.body.createTextRange();
    r.moveToPoint(window.event.x, window.event.y);
    r.expand("word");
    r.select();
    }
</script>

调用如：
<H1 id="myH1" onclick="selectMe()">Click on a
word and it will highlight</H1>

对英文有效，对中文只能选中一个汉字
         
12、javascript中的trim方法

方法一：

function  trim(str)
{
for(var  i  =  0  ;  i<str.length  &&  str.charAt(i)=="  "  ;  i++  )  ;
for(var  j  =str.length;  j>0  &&  str.charAt(j-1)=="  "  ;  j--)  ;
if(i>j)  return  "";  
return  str.substring(i,j);  
}

方法二：
//  增加一个名为  trim  的函数作为
//  String  构造函数的原型对象的一个方法。
String.prototype.trim  =  function()
{
        //  用正则表达式将前后空格
        //  用空字符串替代。
        return  this.replace(/(^\s*)|(\s*$)/g,  "");
}

//  有空格的字符串
var  s  =  "        我的长度        ";

//  显示trim前长度
window.alert(s  +  "  trim前长度：  ("  +  s.length  +  ")");

//  删除前后空格
s  =  s.trim();
//  显示trim后长度
window.alert(s  +  "    trim后长度：("  +  s.length  +  ")");


13、完美关闭窗口

function CloseWin()
{
var ua=navigator.userAgent
var ie=navigator.appName=="Microsoft Internet Explorer"?true:false
if(ie){
    var IEversion=parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE "))))
 if(IEversion< 5.5){
    var str  = '<object id=noTipClose classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">'
    str += '<param name="Command" value="Close"></object>';
    document.body.insertAdjacentHTML("beforeEnd", str);
    document.all.noTipClose.Click();
    }
    else{
    window.opener =null;
    window.close();
    }
}
else{
window.close()
}
}

14.javascript操作select

//  1.判断select选项中 是否存在Value="paraValue"的Item        
function  jsSelectIsExitItem(objSelect, objItemValue) {        
     var  isExit  =   false ;        
     for  ( var  i  =   0 ; i  <  objSelect.options.length; i ++ ) {        
         if  (objSelect.options[i].value  ==  objItemValue) {        
            isExit  =   true ;        
             break ;        
        }        
    }        
     return  isExit;        
}         
   
//  2.向select选项中 加入一个Item        
function  jsAddItemToSelect(objSelect, objItemText, objItemValue) {        
     // 判断是否存在        
     if  (jsSelectIsExitItem(objSelect, objItemValue)) {        
        alert( " 该Item的Value值已经存在 " );        
    }  else  {        
         var  varItem  =   new  Option(objItemText, objItemValue);      
        objSelect.options.add(varItem);     
        alert( " 成功加入 " );     
    }        
}        
   
//  3.从select选项中 删除一个Item        
function  jsRemoveItemFromSelect(objSelect, objItemValue) {        
    // 判断是否存在        
     if  (jsSelectIsExitItem(objSelect, objItemValue)) {        
         for  ( var  i  =   0 ; i  <  objSelect.options.length; i ++ ) {        
             if  (objSelect.options[i].value  ==  objItemValue) {        
                objSelect.options.remove(i);        
                 break ;        
            }        
        }        
        alert( " 成功删除 " );        
    }  else  {        
        alert( " 该select中 不存在该项 " );        
    }        
}    
   
   
//  4.删除select中选中的项    
function  jsRemoveSelectedItemFromSelect(objSelect) {        
     var  length  =  objSelect.options.length  -   1 ;    
     for ( var  i  =  length; i  >=   0 ; i -- ){    
         if (objSelect[i].selected  ==   true ){    
            objSelect.options[i]  =   null ;    
        }    
    }    
}      
   
//  5.修改select选项中 value="paraValue"的text为"paraText"        
function  jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {        
     // 判断是否存在        
     if  (jsSelectIsExitItem(objSelect, objItemValue)) {        
        for  ( var  i  =   0 ; i  <  objSelect.options.length; i ++ ) {        
            if  (objSelect.options[i].value  ==  objItemValue) {        
                objSelect.options[i].text  =  objItemText;        
                 break ;        
            }        
        }        
        alert( " 成功修改 " );        
    }  else  {        
        alert( " 该select中 不存在该项 " );        
    }        
}        
   
//  6.设置select中text="paraText"的第一个Item为选中        
function  jsSelectItemByValue(objSelect, objItemText) {            
     // 判断是否存在        
    var  isExit  =   false ;        
     for  ( var  i  =   0 ; i  <  objSelect.options.length; i ++ ) {        
         if  (objSelect.options[i].text  ==  objItemText) {        
            objSelect.options[i].selected  =   true ;        
            isExit  =   true ;        
             break ;        
        }        
    }              
     // Show出结果        
     if  (isExit) {        
        alert( " 成功选中 " );        
    }  else  {        
        alert( " 该select中 不存在该项 " );        
    }        
}        
   
//  7.设置select中value="paraValue"的Item为选中    
document.all.objSelect.value  =  objItemValue;    
       
//  8.得到select的当前选中项的value    
var  currSelectValue  =  document.all.objSelect.value;    
       
//  9.得到select的当前选中项的text    
var  currSelectText  =  document.all.objSelect.options[document.all.objSelect.selectedIndex].text;    
       
//  10.得到select的当前选中项的Index    
var  currSelectIndex  =  document.all.objSelect.selectedIndex;    
       
//  11.清空select的项    
document.all.objSelect.options.length  =   0 ;