Home  >  Article  >  Web Front-end  >  JavaScript technology often used in B/S development_javascript skills

JavaScript technology often used in B/S development_javascript skills

PHP中文网
PHP中文网Original
2016-05-16 19:04:16794browse

In the application of JavaScript, it is recommended to read every piece of code that is frequently used. Note that this article has three pages. Read it carefully and study each one thoroughly. Then you will be familiar with the common problems on the web page

1. Verification category
1. Within digital verification
1.1 Integer
1.2 Integer greater than 0 (used for verification of passed ID)
1.3 Verification of negative integer
1.4 The integer cannot be greater than iMax
1.5 The integer cannot be less than iMin
2. Time class
2.1 Short time, in the form of (13:04:06)
2.2 Short date, in the form of (2003-12-05 )
2.3 A long time, in the shape of (2003-12-05 13:04:06)
2.4 Only year and month. In the form of (2003-05, or 2003-5)
2.5 Only hours and minutes, in the form of (12:03)
3. Form class
3.1 All form values ​​cannot be empty
3.2 The value of the multi-line text box cannot be empty.
3.3 The value of the multi-line text box cannot exceed sMaxStrleng
3.4 The value of the multi-line text box cannot be less than sMixStrleng
3.5 Determine whether the radio button is selected.
3.6 Determine whether the check box is selected.
3.7 Select all check boxes, multiple selections, unselect all, inverse selection
3.8 Determine the file type during file uploading
4. Character type
4.1 The judgment characters are all composed of letters from a-Z or A-Z
4.2 The judgment characters are composed of letters and numbers.
4.3 Judgment characters are composed of letters, numbers, underscores, and dots. The beginning can only be an underscore and a letter
4.4 String replacement function.Replace();
5. Browser class
5.1 Determine the browser type
5.2 Determine the ie version
5.3 Determine the resolution of the client

6. Combined class
6.1 Determine email.
6.2 Verification of mobile phone number
6.3 Verification of ID card


2. Functional category

1. Time and related controls
1.1 Calendar
1.2 Time control
1.3 Perpetual calendar
1.4 Display dynamic display clock effect (text, such as time in OA)
1.5 Display dynamic display clock effect (image, like watch)
2. Form class
2.1 Automatically generate forms
2.2 Dynamically add, modify, and delete elements in the drop-down box
2.3 Drop-down box where content can be entered
2.4 Only iMax text can be entered in the multi-line text box. If you input too much, it will be automatically reduced to iMax text (mostly used for sending text messages)

3. Print class
3.1 Print control
4. Event class
4.1 Shield right click
4.2 Block all function keys
4.3 --> and <-- F5 F11, F9, F1
4.4 Block key combination ctrl N
5. Web design
5.1 Continuous scrolling text and pictures (Note that it is continuous, there is no blank space between the two paragraphs of text and pictures)
5.2 HTML editing control class
5.3 Color selection box control
5.4 Drop-down menu
5.5 Two-level or multi-level drop-down menu
5.6 Buttons imitating IE menu. (The effect is like the navigation column of rongshuxa.com)
5.7 Dynamic effects of status bar and title bar (there are many examples, you can study them)
5.8 After double-clicking, the web page automatically scrolls
6. Tree structure.
6.1 asp SQL version
6.2 asp xml sql version
6.3 java sql or java sql xml
7. Production of borderless effect
8. Linked drop-down box technology
9. Text sorting


1. Verification type
1. Numeric verification
1.1 Integer
/^(-| )?d $/.test(str)
1.2 An integer greater than 0 (used for verification of the passed ID)
/^d $/.test(str)
1.3 Verification of negative integers
/^-d $/.test(str)
2. Time class
2.1 Short time, in the form of (13:04:06)
function isTime(str)
{
var a = str.match(/^(d{1 ,2})(:)?(d{1,2})2(d{1,2})$/);
if (a == null) {alert('The input parameter is not in time format' ); return false;}
if (a[1]>24 || a[3]>60 || a[4]>60)
{
alert("The time format is incorrect ");
return false
        }
        return true;
      }
  2.2 短日期,形如 (2003-12-05)
      function strDateTime(str)
      {
         var r = str.match(/^(d{1,4})(-|/)(d{1,2})2(d{1,2})$/); 
         if(r==null)return false; 
         var d= new Date(r[1], r[3]-1, r[4]); 
         return (d.getFullYear()==r[1]&&(d.getMonth() 1)==r[3]&&d.getDate()==r[4]);
      }
  2.3 长时间,形如 (2003-12-05 13:04:06)
      function strDateTime(str)
      {
        var reg = /^(d{1,4})(-|/)(d{1,2})2(d{1,2}) (d{1,2}):(d{1,2}):(d{1,2})$/; 
        var r = str.match(reg); 
        if(r==null)return false; 
        var d= new Date(r[1], r[3]-1,r[4],r[5],r[6],r[7]); 
        return (d.getFullYear()==r[1]&&(d.getMonth() 1)==r[3]&&d.getDate()==r[4]&&d.getHours()==r[5]&&d.getMinutes()==r[6]&&d.getSeconds()==r[7]);
      }
  2.4 只有年和月。形如(2003-05,或者2003-5)
  2.5 只有小时和分钟,形如(12:03)
3、表单类
  3.1 所有的表单的值都不能为空
      
  3.2 多行文本框的值不能为空。
  3.3 多行文本框的值不能超过sMaxStrleng
  3.4 多行文本框的值不能少于sMixStrleng
  3.5 判断单选框是否选择。
  3.6 判断复选框是否选择.
  3.7 复选框的全选,多选,全不选,反选
  3.8 文件上传过程中判断文件类型
4、字符类
  4.1 判断字符全部由a-Z或者是A-Z的字字母组成
      
  4.2 判断字符由字母和数字组成。
      
  4.3 判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母
      /^([a-zA-z_]{1})([w]*)$/g.test(str)
  4.4 字符串替换函数.Replace();
5、浏览器类
  5.1 判断浏览器的类型
      window.navigator.appName
  5.2 判断ie的版本
      window.navigator.appVersion
  5.3 判断客户端的分辨率
      window.screen.height;  window.screen.width;

6、结合类
  6.1 email的判断。
      function ismail(mail)
      {
        return(new RegExp(/^w ((-w )|(.w ))*@[A-Za-z0-9] ((.|-)[A-Za-z0-9] )*.[A-Za-z0-9] $/).test(mail));
      }
  6.2 手机号码的验证
  6.3 身份证的验证
      function isIdCardNo(num)
      {
        if (isNaN(num)) {alert("输入的不是数字!"); return false;}
        var len = num.length, re; 
        if (len == 15)
          re = new RegExp(/^(d{6})()?(d{2})(d{2})(d{2})(d{3})$/);
        else if (len == 18)
re = new RegExp(/^(d{6})()?(d{4})(d{2})(d{2})(d{3})(d)$/);
else {alert("The number of digits entered is wrong!"); return false;}
var a = num.match(re);
if (a != null)
{
if (len==15)
                                                                                                                                                                                                                                                         getYear()==a[3]&&(D.getMonth() 1)==a[4]&&D.getDate()==a[5];
                                                                                                                                                      > var D = new Date(a[3] "/" a[4] "/" a[5]);
var B = D.getFullYear()==a[3]&&(D.getMonth( ) 1)==a[4]&&D.getDate()==a[5];
         }
                                                                                                                The date is wrong! "); return false;}
return true;
;form name=hrong>
Select All














Select All














< ;SCRIPT LANGUAGE="JavaScript">
function checkAll(str)
{
var a = document.getElementsByName(str);
var n = a.length;
for (var i=0; i a[i].checked = window.event.srcElement.checked;
}
function checkItem(str)
{
var e = window.event.srcElement;
var all = eval("document.hrong." str);
if (e.checked)
{
var a = document.getElementsByName(e.name) ;
all.checked = true;
for (var i=0; i {
if (!a[i].checked){ all.checked = false; break;}
}
}
else all.checked = false;
}


3.8 Determining the file type during file upload


画图:
id=S 
style="LEFT: 0px; WIDTH: 392px; TOP: 0px; HEIGHT: 240px" 
height=240 
width=392 
classid="clsid:369303C2-D7AC-11D0-89D5-00A0C90833E6">

<SCRIPT> <br>S.DrawingSurface.ArcDegrees(0,0,0,30,50,60); <br>S.DrawingSurface.ArcRadians(30,0,0,30,50,60); <br>S.DrawingSurface.Line(10,10,100,100); <br></SCRIPT>

写注册表:
<SCRIPT> <br>var WshShell = WScript.CreateObject("WScript.Shell"); <br>WshShell.RegWrite ("HKCU\Software\ACME\FortuneTeller\", 1, "REG_BINARY"); <br>WshShell.RegWrite ("HKCU\Software\ACME\FortuneTeller\MindReader", "Goocher!", "REG_SZ"); <br>var bKey =    WshShell.RegRead ("HKCU\Software\ACME\FortuneTeller\"); <br>WScript.Echo (WshShell.RegRead ("HKCU\Software\ACME\FortuneTeller\MindReader")); <br>WshShell.RegDelete ("HKCU\Software\ACME\FortuneTeller\MindReader"); <br>WshShell.RegDelete ("HKCU\Software\ACME\FortuneTeller\"); <br>WshShell.RegDelete ("HKCU\Software\ACME\"); <br></SCRIPT>

TABLAE相关(客户端动态增加行列)


function numberCells() {
    var count=0;
    for (i=0; i < document.all.mytable.rows.length; i ) {
        for (j=0; j < document.all.mytable.rows(i).cells.length; j ) {
            document.all.mytable.rows(i).cells(j).innerText = count;
            count ;
        }
    }
}



    
    
    


 

1.身份证严格验证:

<script> <br>var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"} <br><br>function cidInfo(sId){ <br> var iSum=0 <br> var info="" <br> if(!/^d{17}(d|x)$/i.test(sId))return false; <br> sId=sId.replace(/x$/i,"a"); <br> if(aCity[parseInt(sId.substr(0,2))]==null)return "Error:非法地区"; <br> sBirthday=sId.substr(6,4) "-" Number(sId.substr(10,2)) "-" Number(sId.substr(12,2)); <br> var d=new Date(sBirthday.replace(/-/g,"/")) <br> if(sBirthday!=(d.getFullYear() "-"  (d.getMonth() 1)   "-"   d.getDate()))return "Error:非法生日"; <br> for(var i = 17;i>=0;i --) iSum  = (Math.pow(2,i) % 11) * parseInt(sId.charAt(17 - i),11) <br>if(iSum !=1)return "Error: Illegal certificate number"; <br> return aCity[parseInt(sId.substr(0,2))] "," sBirthday "," (sId.substr(16,1 )%2?"Male":"Female") <br>} <br><br>document.write(cidInfo("380524198002300016"),"<br/>"); <br>document.write( cidInfo("340524198002300019"),"<br/>") <br>document.write(cidInfo("340524197711111111"),"<br/>") <br>document.write(cidInfo("34052419800101001 x "),"<br/>"); <br></script>

2. Verify IP address




3. The borderless window can still be used after adding sp1! !



Chromeless Window