Langauge/JavaScript (23) 썸네일형 리스트형 [JavaScript] 폼 유효성 검사 1. 파일첨부 [ 파일첨부가 있을 경우 ] 중요! form name="registerFrm" action="register.do" method="post" 와 같이하면 파일은 절대 전송이 안되어진다. form name="registerFrm" action="register.do" method="post" enctype="multipart/form-data" 로 해야만 파일이 전송 되어진다. 2. 출생년도 및 나이 태그로 출생년도 선택하기 및 나이 계산하기 태그는 드롭다운 박스를 만드는 틀이며, 태그를 통해 드롭다운박스 내부의 내용물 즉, item을 만들 수 있다. ※ [참고] ※ [ NaN 이란 ] Not a Number 의 축약형으로, 다음과 같다. isNaN(값) : 값이 숫자가 아니라면 true i.. [JavaScript] daum 을 이용하여 우편번호 및 주소 검색 기존에 만들었던 체크박스(1) 에서 daum 에서 제공하는 소스를 이용하여 우편번호 및 주소 검색기능을 추가할 것이다. 추가로, css 도 약간 변경해주었다. 1. daum의 소스의 경로 추가하기 daum에서 해당 소스의 경로이다. 2. 우편번호 및 주소 검색 소스 추가하기 해당 소스는 daum에서 제공하는 우편번호 및 주소 검색소스로, 그대로 긁어온 것이다. html 작성시, 일부 id 속성값을 duam 소스와 동일하게 지정해주어야 한다. 1. 주소의 참고항목 duam 소스와 동일하게 id="extraAddress" 로 지정해주었다. 2. 우편번호 duam 소스와 동일하게 id="postcode" 로 지정해주었다. // daum 의 소스를 따온 것 function openDaumPOST() { new .. [JavaScript] 체크박스(2) ※ 문서가 로딩되어진 다음에, 바로 선택자인 name 속성을 읽어오려면, window.onload = function() {} 를 꼭 넣어줘야 한다. -- 01checkBoxText 와의 차이!!! window.onload = function() { } 안에 아래의 코드를 작성할 것이다. 1. 체크박스 여러개중 라디오 처럼 1개만 선택 const list_product_old = document.getElementsByName("product_old"); // 노드리스트(중고품) for(let product_old of list_product_old) { // 하나의 체크박스를 선택함. 타입은 var 도 상관없다. product_old.addEventListener("click", ()=>{ // 선택한.. [JavaScript] 체크박스(1) ※ 문서가 로딩되어진 다음에, onclick 함수를 바로 호출했다. 즉, 로딩했을때 선택자(속성) 호출이 아닌 클릭했을때 onclick 함수를 호출했다. 그러므로 window.onload = function(){} 은 사용하지 않는다. -- 02checkBoxText 와의 차이!!! 1. 체크박스 여러개중 라디오 처럼 1개만 선택 function onlyOneCheck(obj) { // obj 는 클릭한 체크박스를 의미함. 즉, this const arr_product_old = document.getElementsByName("product_old"); // 중고품 input 태그의 name 속성 for(let product_old of arr_product_old) { // product_old 은 .. [JavaScript] 콘솔창(F12)에서 소스보기 금지 [ 소스보기 금지 ] oncontextmenu="return false" : 마우스 우클릭 금지 ondragstart="return false" : 드래그 금지 onselectstart="return false" : 선택복사 금지 onkeydown="return keydowncheck();" : 키보드 F12 금지 [ onselectstart="return false" 에 노란줄 및 [Undefined attribute name]의 이클립스 경고(Warning) 해결방안 ] "Undefined attribute name"은 HTML에서 지정하지 않은 속성을 사용하고 있다는 경고이다. 이러한 "Undefined attribute name" 경고를 보이지 않게 하려면 아래와 같이 하면 된다. Window -.. [JavaScript] error 발생 및 try catch finally 문 1. error 발생 func_plus(2,3); // 존재하지 않는 함수 document.getElementById("mydiv").innerHTML = "안녕하세요?" ==> Uncaught ReferenceError: func_plus is not defined at window.onload 위와 같은 오류 발생함. 2. try catch 문 try { func_plus(2,3); // 존재하지 않는 함수 } catch(e) { // event 또는 exception 을 의미한다. document.getElementById("error").innerHTML = `오류발생 : ${e}`; } document.getElementById("mydiv").innerHTML = "안녕하세요?"; ==> 오류.. [JavaScript] Math 객체 1. Math.abs(); : 절대값 document.getElementById("val1").innerHTML = Math.abs(20-25); // 절대값 ==> 5 2. Math.ceil(); : 입력값보다 큰 최소의 정수 만약, 소수부가 없는 정수라면 그대로 정수가 나온다. document.getElementById("val2").innerHTML = Math.ceil(10/4); // 2.5 보다 큰 최소의 정수 ==> 3 document.getElementById("val3").innerHTML = Math.ceil(10/5); // 2 소수부가 없는 정수라면 그대로 정수 ==> 2 3. Math.floor(); : 입력값보다 작은 최대의 정수 만약, 소수부가 없는 정수라면 그대로 정수가 나온.. [JavaScript] 문자열을 유효한 URI 로 인코딩/디코딩 ※ 문자열입력(한글) URI로 인코딩된 값 URI를 디코딩된 값 변경 다시 URI로 인코딩된 값 입력 URI를 디코딩된 값 변경 다시 1. 문서 로딩 후 입력텍스트 란에 커서 움직이게 하기 document.querySelector("input#inputText").focus(); ==> document.querySelector(css선택자).focus(); 문법이다. ==> 문서가 로딩되어지는 순간 입력텍스트 란에 커서가 깜빡깜빡 움직인다. document.querySelector("input#inputText").focus(); // 문서가 로딩되어지는 순간 입력텍스트 란에 커서가 움직인다. 2. 문자열 입력(한글) -> URI로 인코딩된 값 -> URI를 디코딩된 값 변환시키기 1. .. 이전 1 2 3 다음
