在使用JS框架之前自己写的一些工具代码

转载 于 2016-04-16 15:48:25 发布 · 363 阅读 · 0

本文介绍了一系列实用的前端JavaScript技巧，包括DOM操作、表单验证、Cookie管理等，并详细解析了AJAX的工作原理及使用方法。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

//vb2005xu@sina.com版权所有 (*^__^*) 嘻嘻……  
  
//function -- Debug  
function debug(msg)  
{  
    if (msg == undefined)  
    {  
        msg = 'Not Parameter' ;  
    }  
    alert('Debug: ' + msg);  
}  
  
//function -- DOM  
function $(id){return document.getElementById(id);}  
function $name(ids){return document.getElementsByName(ids);}  
  
//function -- 操作 隐藏/显示 ; 禁用/恢复  
function hide(obj){obj.style.display="";}  
function unhide(obj){obj.style.display="none";}  
function lock(obj){obj.disabled="disabled";}  
function unlock(obj){obj.disabled="";}  
function getFocus(obj){obj.focus();}  
function setSelect(obj){obj.select();}  
  
//function -- Form 控件操作  
function unlockTextInput(id){var obj=$(id);unlock(obj);getFocus(obj);setSelect(obj);}  
function unlockSelectOption(id){var obj=$(id);unlock(obj);getFocus(obj);}  
function checkboxVarity(ids) //验证多选框有无选中  
{  
    var checkboxobj = $name(ids);  
    var selectState = false    ;  
    for(i = 0 ; i < checkboxobj.length ; i++ )  
    {  
       if (checkboxobj[i].checked)  
       {  
            selectState = true ;  
            break ;  
       }  
    }  
    return selectState ;  
}  
  
//function -- Cookie  
function createCookie(name, value, days) {  
    var expires = '';  
    if (days) {  
        var date = new Date();  
        date.setTime(date.getTime() + (days*24*60*60*1000));  
        var expires = '; expires=' + date.toGMTString();  
    }  
    document.cookie = name + '=' + value + expires + '; path=/';  
}  
function readCookie(name) {  
    var cookieCrumbs = document.cookie.split(';');  
    var nameToFind = name + '=';  
    for (var i = 0; i < cookieCrumbs.length; i++) {  
        var crumb = cookieCrumbs[i];  
        while (crumb.charAt(0) == ' ') {  
            crumb = crumb.substring(1, crumb.length); /* delete spaces */  
        }  
        if (crumb.indexOf(nameToFind) == 0) {  
            return crumb.substring(nameToFind.length, crumb.length);  
        }  
    }  
    return null;  
}  
function eraseCookie(name) {  
    createCookie(name, '', -1);  
}  
  
  
//function -- Base64  
function stringToBase64(string, padchar) {  
    return window.btoa(string);  
}  
  
function base64ToString(string) {  
    string = string.replace(/\s+/g, "");  
    return window.atob(string);  
}  
  
//function -- 操作Table  
function getCurrentLineIndex(id){var obj=$(id);return obj.rowIndex;}  
function getCurrentColumnIndex(id){var obj=$(id);return obj.cellIndex;}  
  
  
//function -- 操作Code  
function codeHightLight(id){var obj=$(id);obj.style.background='#fff';}  
  
//Ajax  
      
        //define a bool paramter to check IE instance  
        var xmlhttp = false ;  
  
        //check client brower is IE  
        try {  
            // If javascript is greater than 5  
            xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");  
            //alert("You are using Microsoft Internet Explorer .");  
        }  
        catch (e){  
            //else will use ActiveXObject older version  
            try {  
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");  
                //alert("You are using old Microsoft Internet Explorer .");  
            }  
            catch (e){  
                 //using brower is no IE.  
                 xmlhttp = false ;  
            }  
        }  
        if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {  
            xmlhttp = new XMLHttpRequest();  
            //alert("You are not using Microsoft Internet Explorer .");  
        }  
        function appendText(obj,xmlhttp)  
        {  
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200 ){  
                    obj.innerHTML = xmlhttp.responseText ;  
            }  
        }  
        function makerequest(serverpage,objID)  
        {  
             var obj = document.getElementById(objID);  
             xmlhttp.open("GET",serverpage);  
  
             xmlhttp.onreadystatechange = appendText(obj,xmlhttp) ;  
             xmlhttp.send(null) ;  
        }  
  
/** 
 * ################### 
 * ###################        Lalestory 项目中抽取出来的JS功能函数--作者: 许消寒 
 * ################### 
 */   
  
/** 
 * 功能：判断一个字符串是否为空字符串 
 * 参数：str 检验值 
 * 返回：TRUE OR FALSE 
 */  
function isBlank(str){  
  if(str.length < 1){  
    return true;  
  }  
  
  for(i = 0; i < str.length; i ++){  
    if(str.substring(i, i + 1) != ' '){  
      return false;  
    }  
  }  
    
  return true;  
}  
  
  
/** 
 * 功能：检验长度是否正确 
 * 参数：str 检验值,minlen 最小长度,maxlen 最大长度 
 * 返回：TRUE OR FALSE 
 */  
function checkByteLength(str,minlen,maxlen) {  
    if (str == null) return false;                                  //为空返回false  
    var l = str.length;  
    var blen = 0;  
    for(i=0; i<l; i++) {                                     //循环取得检验值的长度  
        if ((str.charCodeAt(i) & 0xff00) != 0) {  
            blen ++;  
        }  
        blen ++;  
    }  
    if (blen > maxlen || blen < minlen) {                         //判断长度是否合法  
        return false;  
    }  
    return true;  
}  
/** 
 * 功能：检验用户名是否合法 
 * 参数：value 检验值 
 * 返回：TRUE OR FALSE 
 */  
function validateUsername(value){  
    var patn = /^[a-zA-Z]+[a-zA-Z0-9]+$/;   
    //var patn = /^[^\s]*$/;  
    if(!checkByteLength(value,4,20)) return true;                   //判断长度是否合法  
    if(!patn.test(value)){                                      //判断格式是否合法  
        return true;  
    }  
    return false;   
}  
  
  
/** 
 * 功能：检验登陆或者注册的用户名 -- 用户名称至少为4个字符,但是少于20个字符 
 * 参数：value 检验值 
 * 返回：TRUE OR FALSE 
 */  
function checkUserName(value)  
{  
    if(value == '')                                         //判断用户名是否为空，返回false  
    {  
        return false;  
    }  
    if(validateUsername(value))                             //判断用户名是否合法  
    {  
        return false;  
    }  
    return true;  
}  
  
  
/** 
 * 功能：检验Email是否合法 
 * 参数：value 检验值 
 * 返回：TRUE OR FALSE 
 */  
function validateEmail(value){  
    var patn=/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;  
    if(!patn.test(value)) return false;                             //判断Email是否合法  
    return true;  
}  
/** 
 * 功能：检验Email 
 * 参数：value 检验值 
 * 返回：TRUE OR FALSE 
 */  
function CheckEmail(value)  
{  
    if(value == '')                                         //判断Email是否为空  
    {  
        return false;  
    }  
    if(!validateEmail(value))                                   //判断Email是否合法  
    {  
        return false  
    }  
    return true;  
}  
  
/** 
 * 功能: 检验是否包含特殊字符 
 * 参数：value 检验值 
 * 返回：TRUE OR FALSE 
 */   
function validateSpecSymbol(value) {  
    return true ;//! /^[a-zA-Z0-9\u4E00-\u9FA5#\]*$/.test(value);  
}  
  
/** 
 * 功能: 检验是否包含特殊字符 
 * 参数：value 检验值 
 * 返回：TRUE OR FALSE 
 */  
  
function CheckSpecSymbol(value)  
{  
    if(value == '')                                         //判断Email是否为空  
    {  
        return false;  
    }  
    if(!validateSpecSymbol(value))                                  //判断Email是否合法  
    {  
        return false ;  
    }  
    return true;      
}   
/** 
 * 功能: 返回指定颜色的文本 
 * 参数：content 文本 , colorValue为颜色值 , cssClass 为CSS风格 
 * 返回：TRUE OR FALSE 
  */  
 function getSpeciColorText(content,size,colorValue,cssClass)  
 {  
     var str = "<font size='" + size + "' class='" ;  
     str +=  cssClass + "' color='"  
     str += colorValue + "'>" ;  
     str += content + "</font>" ;  
     return str ;  
 }  
 /** 
  * 功能: 在指定的页面标签后放入一张图片 
  * 参数：parentTagName为指定的页面标签 ,imgsrc为图片路径 
  * 返回：TRUE OR FALSE 
  */  
 function appendImg(parentTagName,imgsrc)  
 {  
     //接收 document.all.yourTagName  
     var parentTag = document.getElementsByName(parentTagName)[0] ;  
     var str = "<img src='" + imgsrc + "'>" ;  
     parentTagName.innerHTML = str ;  
 }  
   
   
 /* ################################## 在beijingextreme项目中的具体应用 ###############################*/  
   
 //function -- 操作层  
 function $(elementID)  
 {  
     return document.getElementById(elementID) ;  
 }  
   
 function showDiv(divID)  
 {  
     var divId = $(divID) ;  
     divId.style.display = "" ;  
 }  
 function hideDiv(divID)  
 {  
     var divId = $(divID) ;  
     divId.style.display = "none" ;  

 }  

  1. //1.彻底屏蔽鼠标右键  
  2. oncontextmenu="window.event.returnValue=false"  
  3. <table border oncontextmenu=return(false)><td>no</table> 可用于Table  
  4.   
  5. //2.取消选取、防止复制  
  6. <body onselectstart="return false">  
  7.   
  8. //3.不准粘贴  
  9. onpaste="return false"   
  10.   
  11. //4.防止复制  
  12. oncopy="return false;" oncut="return false;"  
  13.   
  14.   
  15. //5.离开页面时要求确认  
  16. window.onbeforeunload = function(){return '';}; //增加事件  
  17. window.onbeforeunload = null;   //删除事件  
  18.   
  19.   
  20. //6.IE地址栏前换成自己的图标  
  21. <link rel="Shortcut Icon" href="favicon.ico">  
  22.   
  23. //7.可以在收藏夹中显示出你的图标  
  24. <link rel="Bookmark" href="favicon.ico">  
  25.   
  26. //8.关闭输入法  
  27. <input style="ime-mode:disabled">  
  28.   
  29.   
  30. //9.网页将不能被另存为  
  31. <noscript><*** src="/*.html>";</***></noscript>  
  32.   
  33.   
  34. //10.取得控件的绝对位置  
  35. //Javascript  
  36. <script language="Javascript">  
  37. function getIE(e){  
  38. var t=e.offsetTop;  
  39. var l=e.offsetLeft;  
  40. while(e=e.offsetParent){  
  41. t+=e.offsetTop;  
  42. l+=e.offsetLeft;  
  43. }  
  44. alert("top="+t+"/nleft="+l);  
  45. }  
  46. </script>  
  47.   
  48.   
  49. //11.光标是停在文本框文字的最后  
  50. <script language="javascript">  
  51. function cc()  
  52. {  
  53. var e = event.srcElement;  
  54. var r =e.createTextRange();  
  55. r.moveStart("character",e.value.length);  
  56. r.collapse(true);  
  57. r.select();  
  58. }  
  59. </script>  
  60. <input type=text name=text1 value="123" onfocus="cc()">  
  61.   
  62. //12.判断上一页的来源  
  63. javascript :  
  64. document.referrer  
  65.   
  66. //13.最小化、最大化、关闭窗口  
  67. <object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">  
  68. <param name="Command" value="Minimize"></object>  
  69. <object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">  
  70. <param name="Command" value="Maximize"></object>  
  71. <OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">  
  72. <PARAM NAME="Command" value="/Close"></OBJECT>  
  73. <input type=button value="/最小化 onclick=hh1.Click()>  
  74. <input type=button value="/blog/最大化 onclick=hh2.Click()>  
  75. <input type=button value=关闭 onclick=hh3.Click()>  
  76. //本例适用于IE  
  77.   
  78. //屏蔽功能键Shift,Alt,Ctrl  
  79. <script>  
  80. function look(){  
  81. if(event.shiftKey)  
  82. alert("禁止按Shift键!"); //可以换成ALT　CTRL  
  83. }  
  84. document.onkeydown=look;  
  85. </script>  
  86.   
  87. //网页不会被缓存  
  88. <META HTTP-EQUIV="pragma" CONTENT="no-cache">  
  89. <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">  
  90. <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">  
  91. 或者<META HTTP-EQUIV="expires" CONTENT="0">  
  92.   
  93. //让弹出窗口总是在最上面:  
  94. <body onblur="this.focus();">  
  95.   
  96. //怎样去掉图片链接点击后，图片周围的虚线？  
  97. <a href="#" onFocus="this.blur()"><img src="/logo.jpg" border=0></a>  
  98.   
  99. //电子邮件处理提交表单  
  100. <form name="form1" method="post" action=mailto:****@***.com  
  101. enctype="text/plain">  
  102. <input type=submit>  
  103. </form>  
  104.   
  105. //在打开的子窗口刷新父窗口的代码里如何写？  
  106. window.opener.location.reload()  
  107.   
  108.   
  109. //在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动  
  110. <STYLE>  
  111. body  
  112. {background-image:url(/https/blog.csdn.net/logo.gif); background-repeat:no-repeat;  
  113. background-position:center;background-attachment: fixed}  
  114. </STYLE>  
  115.   
  116.   
  117. //怎么判断是否是字符  
  118. if (/[^/x00-/xff]/g.test(s)) alert("含有汉字");  
  119. else alert("全是字符");  
  120.   
  121. TEXTAREA自适应文字行数的多少  
  122. <textarea rows=1 name=s1 cols=27 onpropertychange  
  123. ="this.style.posHeight=this.scrollHeight">  
  124. </textarea>  
  125.   
  126.   
  127. //选择了哪一个Radio  
  128. <HTML><script language="vbscript">  
  129. function checkme()  
  130. for each ob in radio1  
  131. if ob.checked then  
  132. window.alert ob.value  
  133. next  
  134. end function  
  135. </script><BODY>  
  136. <INPUT name="radio1" type="radio" value="/style" checked>Style  
  137. <INPUT name="radio1" type="radio" value="/blog/barcode">Barcode  
  138. <INPUT type="button" value="check" onclick="checkme()">  
  139. </BODY></HTML>  

评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值