집 > 기사 > 웹 프론트엔드 > b/s 개발에 자주 사용되는 JavaScript 기술_javascript 기술

b/s 개발에 자주 사용되는 JavaScript 기술_javascript 기술

WBOY원래의: 2016-05-16 19:27:07871검색

1. 검증 카테고리
1. 디지털 검증 내
1.1 정수
1.2 0보다 큰 정수 (전달된 ID 검증에 사용)
1.3 음의 정수 검증
1.4 정수는 다음보다 클 수 없습니다. iMax
1.5 정수는 iMin
2. 시간 클래스
2.1 (13:04:06) 형식의 짧은 시간
2.2 (2003 형식의 짧은 날짜) -12-05)
2.3 긴 시간, (2003-12-05 13:04:06)
2.4 연도와 월만. (2003-05, or 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 판단 문자는 문자, 숫자, 밑줄, 점으로 구성됩니다.
4.4 문자열 대체 함수.Replace()
5. 5.1 브라우저 유형 결정
5.2 IE 버전 결정
5.3 클라이언트 해상도 결정

6. 결합 클래스
6.1 이메일 결정.
6.2 휴대폰번호 확인
6.3 신분증 확인

2. 기능 카테고리

1.1 캘린더
1.2 시간 제어
1.3 달력
1.4 동적 표시 시계 효과 표시(OA의 시간과 같은 텍스트)
1.5 동적 표시 시계 효과 표시(시계와 같은 이미지)
2. Form 클래스
2.1 자동으로 양식 생성
2.2 드롭다운 상자에서 요소를 동적으로 추가, 수정, 삭제
2.3 내용을 입력할 수 있는 드롭다운 상자
2.4 멀티에는 iMax 텍스트만 입력 가능 -라인 텍스트 상자. 너무 많이 입력하면 자동으로 iMax 텍스트로 축소됩니다. (주로 문자 메시지 전송에 사용됩니다.)

3. 인쇄 클래스
3.1 인쇄 제어
4. 이벤트 클래스
4.1 쉴드
마우스 오른쪽 버튼 클릭 4.2 모든 기능 키 차단
4.3 --> 및 4.4 키 조합 차단 ctrl N
5. 웹 디자인 수업
5.1 연속 스크롤 텍스트 및 그림 (참고 연속적이며 텍스트와 그림의 두 문단 사이에 공백이 없습니다) 5.2 HTML 편집 컨트롤 클래스
5.3 색상 선택 상자 컨트롤
5.4 드롭다운 메뉴
5.5 2레이어 또는 다중 레벨 드롭다운 메뉴
5.6 IE 메뉴와 유사한 버튼. (이 효과는 rongshuxa.com의 탐색 열과 같습니다.)
5.7 상태 표시줄 및 제목 표시줄의 동적 효과(예제가 많으므로 학습할 수 있습니다.)
5.8 더블 클릭 후 웹 페이지가 자동으로 스크롤됩니다.
6. 트리 구조.
6.1 asp SQL 버전
6.2 asp xml sql 버전
6.3 java sql 또는 java sql xml
7. 경계선 없는 효과 생성
8. 링크된 드롭다운 박스 기술
9. 텍스트 정렬

1. 검증 유형
1. 숫자 검증
1.1 정수
/^(-| )?d $/.test(str)
1.2 An 0보다 큰 정수 (전달된 ID 확인에 사용)
/^d $/.test(str)
1.3 음수 확인
/^-d $/.test(str)
2. 시간 클래스
2.1 (13:04:06) 형식의 짧은 시간
function isTime(str)
{
var a = str.match(/^(d{ 1 ,2})(:)?(d{1,2})2(d{1,2})$/);
if (a == null) {alert('입력 매개변수가 다음 위치에 없습니다. 시간 형식' ); return false;}
if (a[1]>24 || a[3]>60 || a[4]>60)
{
Alert("시간 형식 올바르지 않음");
false 반환
}
true 반환; 🎜>       {
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, or 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 문자열 대체 function.Replace()
5. 브라우저 클래스
5.1 브라우저 유형
창을 결정합니다. navigator.appName
5.2 IE 버전 확인
Window.navigator.appVersion
5.3 클라이언트 해상도 확인
window.screen.height; >6. 조합수업
6.1 이메일 판단.
함수 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 ID 카드
함수 확인 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} ; 일치(re); " /" a[4] "/" a[5])
var B = D.getYear()==a[3]&(D.getMonth() 1 )==a[4]&&D.getDate ()==a[5];

var B = D.getFullYear()==a[3]&&(D.getMonth() 1)== a[4]&&D.getDate()==a[5];
}
          if (!B) {alert("입력한 ID 번호 " a[0] "에 생년월일이 올바르지 않습니다! "); false 반환;}
true 반환;
🎜>
모두 선택

１．身份证严格验证：

<script> 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:"国外"} function cidInfo(sId){ var iSum=0 var info="" if(!/^\d{17}(\d|x)$/i.test(sId))return false; sId=sId.replace(/x$/i,"a"); if(aCity[parseInt(sId.substr(0,2))]==null)return "Error:非法地区"; sBirthday=sId.substr(6,4)+"-"+Number(sId.substr(10,2))+"-"+Number(sId.substr(12,2)); var d=new Date(sBirthday.replace(/-/g,"/")) if(sBirthday!=(d.getFullYear()+"-"+ (d.getMonth()+1) + "-" + d.getDate()))return "Error:非法生日"; for(var i = 17;i>=0;i --) iSum += (Math.pow(2,i) % 11) * parseInt(sId.charAt(17 - i),11) if(iSum%11!=1)return "Error:非法证号"; return aCity[parseInt(sId.substr(0,2))]+","+sBirthday+","+(sId.substr(16,1)%2?"男":"女") } document.write(cidInfo("380524198002300016")," "); document.write(cidInfo("340524198002300019")," ") document.write(cidInfo("340524197711111111")," ") document.write(cidInfo("34052419800101001x")," "); </script>

２．验证ＩＰ地址
<script> function isip(s){ var check=function(v){try{return (v<=255 && v>=0)}catch(x){return false}}; var re=s.split(".") return (re.length==4)?(check(re[0]) && check(re[1]) && check(re[2]) && check(re[3])):false } var s="202.197.78.129"; alert(isip(s)) </script>

３．加sp1后还能用的无边框窗口！！

Chromeless Window

<script> /*--- Special Thanks For andot ---*/ /* This following code are designed and writen by Windy_sk <seasonx@163.net> You can use it freely, but u must held all the copyright items! */ /*--- Thanks For andot Again ---*/ var CW_width = 400; var CW_height = 300; var CW_top = 100; var CW_left = 100; var CW_url = "/"; var New_CW = window.createPopup(); var CW_Body = New_CW.document.body; var content = ""; var CSStext = "margin:1px;color:black; border:2px outset;border-style:expression(onmouseout=onmouseup=function(){this.style.borderStyle='outset'}, onmousedown=function(){if(event.button!=2)this.style.borderStyle='inset'});background-color:buttonface;width:16px;height:14px;font-size:12px;line-height:11px;cursor:Default;"; //Build Window include.startDownload(CW_url, function(source){content=source}); function insert_content(){ var temp = ""; CW_Body.style.overflow = "hidden"; CW_Body.style.backgroundColor = "white"; CW_Body.style.border = "solid black 1px"; content = content.replace(/<a ([^>]*)>/g,"<a onclick='parent.open(this.href);return false' $1>"); temp += "<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>"; temp += "<tr style=';font-size:12px;background:#0099CC;height:20;cursor:default' ondblclick=\"Max.innerText=Max.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\" onmouseup='parent.drag_up(event)' onmousemove='parent.drag_move(event)' onmousedown='parent.drag_down(event)' onselectstart='return false' oncontextmenu='return false'>"; temp += "<td style='color:#ffffff;padding-left:5px'>Chromeless Window For IE6 SP1"; temp += "<td style='color:#ffffff;padding-right:5px;' align=right>"; temp += "?"; temp += "0"; temp += "1"; temp += "x"; temp += "<tr><td colspan=2>"; temp += "<div id=include style='overflow:scroll;overflow-x:hidden;overflow-y:auto; HEIGHT: 100%; width:"+CW_width+"'>"; temp += content; temp += ""; temp += ""; CW_Body.innerHTML = temp; } setTimeout("insert_content()",1000); var if_max = true; function show_CW(){ window.moveTo(10000, 10000); if(if_max){ New_CW.show(CW_top, CW_left, CW_width, CW_height); if(typeof(New_CW.document.all.include)!="undefined"){ New_CW.document.all.include.style.width = CW_width; New_CW.document.all.Max.innerText = "1"; } }else{ New_CW.show(0, 0, screen.width, screen.height); New_CW.document.all.include.style.width = screen.width; } } window.onfocus = show_CW; window.onresize = show_CW; // Move Window var drag_x,drag_y,draging=false function drag_move(e){ if (draging){ New_CW.show(e.screenX-drag_x, e.screenY-drag_y, CW_width, CW_height); return false; } } function drag_down(e){ if(e.button==2)return; if(New_CW.document.body.offsetWidth==screen.width && New_CW.document.body.offsetHeight==screen.height)return; drag_x=e.clientX; drag_y=e.clientY; draging=true; e.srcElement.setCapture(); } function drag_up(e){ draging=false; e.srcElement.releaseCapture(); if(New_CW.document.body.offsetWidth==screen.width && New_CW.document.body.offsetHeight==screen.height) return; CW_top = e.screenX-drag_x; CW_left = e.screenY-drag_y; } </script>

电话号码的验证

要求：
　　(1)电话号码由数字、"("、")"和"-"构成
　　(2)电话号码为3到8位
　　(3)如果电话号码中包含有区号，那么区号为三位或四位
　　(4)区号用"("、")"或"-"和其他部分隔开
　　(5)移动电话号码为11或12位，如果为12位,那么第一位为0
　　(6)11位移动电话号码的第一位和第二位为"13"
　　(7)12位移动电话号码的第二位和第三位为"13"
　　根据这几条规则，可以与出以下正则表达式：
　　(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^$[0-9]{3,4}$[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)

<script> function PhoneCheck(s) { var str=s; var reg=/(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^$[0-9]{3,4}$[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/ alert(reg.test(str)); } </script>

具有在输入非数字字符不回显的效果，即对非数字字符的输入不作反应。
function numbersonly(field,event){
var key,keychar;
if(window.event){
 key = window.event.keyCode;
}
else if (event){
 key = event.which;
}
else{
 return true
}
keychar = String.fromCharCode(key);
if((key == null)||(key == 0)||(key == 8)||(key == 9)||(key == 13)||(key == 27)){
 return true;
}
else if(("0123456789.").indexOf(keychar)>-1){
 window.status = "";
 return true;
}
else {
 window.status = "Field excepts numbers only";
 return false;
}
}

验证ip

str=document.RegExpDemo.txtIP.value;
if(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/.test(str)==false)
{
window.alert('错误的IP地址格式');
document.RegExpDemo.txtIP.select();
document.RegExpDemo.txtIP.focus();
return;
}
if(RegExp.$1254||RegExp.$2254||RegExp.$3254||RegExp.$4254)
{
window.alert('错误的IP地址');
document.RegExpDemo.txtIP.select();
document.RegExpDemo.txtIP.focus();
return;
}
//剔除如 010.020.020.03 前面的0
var str=str.replace(/0(\d)/g,"$1");
str=str.replace(/0(\d)/g,"$1");
window.alert(str);

성명：

이전 기사：모방 DVBBS 드롭다운 메뉴 효과 jb51이 error_drop-down 메뉴 없이 수정됨다음 기사：모방 DVBBS 드롭다운 메뉴 효과 jb51이 error_drop-down 메뉴 없이 수정됨

b/s 개발에 자주 사용되는 JavaScript 기술_javascript 기술

관련 기사