Html 코딩 #01

html 테이블 input박스 옵션

테이블 색 지정 :  style="border-collapse:collapse" bordercolor="73c2f2"

input 박스 색 지정 : style="border:1px solid;border-color:#bfbdbd;"

input 박스 숫자만 입력 : onkeyPress="if ((event.keyCode<48) || (event.keyCode>57)) event.returnValue=false;"

[출처] html 테이블 input박스 옵션|작성자 다오래

select 박스에 링크 달기

Self 방식
 
<form name="form1">
<select name="selecter" onchange="window.open(value,'_self');">
<option value="none">사이트링크 선택</option>
<option value="http://www.naver.com">네이버</option>
<option value="http://www.naver.com">항목</option>
<option value="http://www.naver.com">항목</option>
</select>
</form>
 
Blank 방식
 
<select onChange='if(this.selectedIndex) { this.blur(); window.open(options[selectedIndex].value); }'>
<option value="">사이트링크 선택</option>
<option value="http://daum.net">다 음</option>
<option value="http://naver.com">네이버</option>
<option value="http://empas.com">엠파스</option>
</select> 

window.open 속성 JavaScript

1. width : 창 가로길이 지정

2. height : 창 세로길이 지정

3. toolbar : 단축도구창 유무 지정 [no, yes]

4. menubar : 메뉴창 유무 지정 [no, yes]

5. location : 주소창 유무 지정 [no, yes]

6. scrollbars : 스크롤바 유무지정 [no, yes]

7. status : 아래 상태바창 유무 지정 [no, yes]

8. resizable : 창변형 유무 지정 [no, yes]

9. fullscreen : 전체화면 유무 지정 [no, yes]

10. channelmode=yes : 앞&뒤로 창최소화,닫기등을 설정 (F11키랑 같음)

11. left=0, top=0 : 창을 왼쪽 구석에 고정

javascript 회원가입 체크

회원등록 폼이나 기타 다른 입력폼에서 필수입력값이나
사용자가 입력한 값을 검사 하는 스크립트입니다.
함수화를 해서 두고 두고 써먹을 수 있으며,
정규표현식 검사를 지정해 줄수 있기 때문에,
편리합니다.

코드를 변경할 필요가 없으며, select 필드도 선택을 했는지 검사 할수
있습니다.

사용자가 *반/드/시* 변경해야할 부분은 ㉠ ~ ㉤ 까지의 부분입니다.

㉠ 은 form 의 이름입니다.
㉡ 은 정규표현식 패턴검사할 목록입니다. (필드 이름과 표현식은 = 으로 구분되며 필드의 구분은 , 로 구분합니다.)
㉢ 은 널값 즉 공백이나 빈값으로 입력되었는지 검사하는 필드의 목록 (마찬가지 , 로 구분)
㉣ 은 필드이름의 배열로 반드시 존재해야 하며, 필드이름 과 경고창에서의
한글로 표시될 필드의 이름 배열입니다. (필드 이름과 표현식은 = 으로 구분되며 필드의 구분은 , 로 구분합니다.)
㉤ 은 select 필드 의 선택검사 부분입니다. (, 로 구분됩니다.)

주의) 코드의 다른 부분은 변경하지 않아도 되구여, 다만 필드의 배열을
정확히 해주어야 합니다. 한개라도 없는 필드이거나, 철자가 틀리면
에러납니다.

참고) ㉠㉡㉢㉤ 은 옵션이며, ㉣ 은 반드시 존재해야 합니다.

적용) 폼태그에 다음과 같이 걸어주면, 설정해준 대로 검사를 하게됩니다.
<form name="..." onsubmit="return condition_value_chk()">


예제 코드)
<script>

// 필수입력값 검사 함수
function condition_value_chk() {
㉠// 폼이름
var form_name = "confirm";

㉡// 패턴검사 목록
var patten_chk = "social1=^[0-9]{6}$,social2=^[0-9]{7}$,email=^[_0-9a-zA-Z-]+(\.[_0-9a-zA-Z-]+)*@[0-9a-zA-Z-]+(\.[0-9a-zA-Z]+)*$";
㉢// 널값 검사 목록
var not_null = "user_name,social1,social2,email";

㉣// 필드이름 배열
var fields = "user_name=이름,social1=주민등록번호 앞자리,social2=주민등록번호 뒷자리,email=이메일 주소";

㉤// 리스트 널값 검사 목록
var not_null_radio = "job";

// 필드배열 생성
if (typeof fields != "undefined") {
var f_arr = fields.split(/,/);
var map = new Array();
for (i in f_arr) {
temp = f_arr[i].split(/\s*=\s*/);
key = temp[0];
val = temp[1];
map[key] = val;
}
}

// 공백필드 검사
if (typeof not_null != "undefined") {
nulls = not_null.split(/,/);
for (i in nulls) {
temp = nulls[i];
myform = eval('document.' + form_name + '.' + temp);
str = myform.value.replace(/\s*/, "");
if (str == "") {
myalert(map[temp], "필수항목이므로 생략할 수 없습니다.\n\n정확히 입력해주세요.");
myform.focus();
return false;
exit;
}
}
}

// 패턴검사
if (typeof patten_chk != "undefined") {
pattens = patten_chk.split(/,/);
for (i in pattens) {
temp = pattens[i].split(/\s*=\s*/);
key = temp[0];
val = temp[1];
val = eval('/'+ val + '/');
myform = eval('document.' + form_name + '.' + key);
str = myform.value;
if (!str.match(val)) {
myalert(map[key], "입력 값 오류 입니다. \n\n정확한 값을 입력해 주세요.");
myform.focus();
return false;
exit;
}
}
}

// 리스트 널 값 검사
if (typeof not_null_radio != "undefined") {
radios = not_null_radio.split(/,/);
for (i in radios) {
temp = radios[i];
myform = eval('document.' + form_name + '.' + temp);
str = myform.options[myform.selectedIndex].value.replace(/\s*/, "");
if (str == "") {
myalert(map[temp], "필수항목이므로 생략할 수 없습니다.\n\n한가지 항목을 선택해주세요.");
myform.focus();
return false;
exit;
}
}
}

return true;
}

function myalert(field, msg) {
alert("입력 항목 - " + field + "\n\n" + msg);
}

</script>

출처 : http://www.cyber.pe.kr/bbs/view.php?id=web&no=15

[출처] javascript 회원가입 체크|작성자 다오래