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;