JavaScript(29)
-
javascript / frame / frameset / 전체 페이지 이동 / 새로고침 / 로그인 페이지 / 인터셉터 / interceptor / redirect / target
구조가 프레임셋 frameset 으로 되어있는 홈페이지를 개발중이였다. 인터셉터 interceptor 로 로그인한 회원의 세션을 체크 후 세션이 없으면 로그인 페이지로 redirect 하는 기능이 필요했다. 프레임셋 구조상 해당 프레임에서만 로그인 페이지로 바뀌었다. 예를 들면 frame 구조가 header frame, left frame, body frame 이 있다고 하고 body frame 에서 페이지 이동을 하다가 인터셉터에서 로그인정보를 체크하고 없으면 로그인페이지로 redirect 하면 body frame 만 로그인 페이지로 이동을 한다. 이때 인터셉터에서 redirect 할 때 특정 target 페이지로 보내고 그 페이지에서 이 소스만 넣어주어야 프레임의 최상단에서 페이지 이동이 일어난다. ..
2016.01.05 -
javascript / 부모창 함수 제어 / 실행 / 팝업 / popup / iframe / 아이프레임
먼저 부모창에 function test(){}이라는 함수가 있다고 가정한다. 1)팝업창의 경우 다음과 같이 작성한다. opener.test(); // 함수가 있는지 확인 if(opener.test){ alert("함수 있음"); } 2)iframe의 경우 다음과 같이 작성한다. parent.test(); 3) 부모창에서 iframe내 함수접근은 다음과 같다. var ifr = document.getElementById('iframeID'); ifr.contentWindow.function_name(); 부모창에서 'iframeID'이라는 iFrame에 지정된 페이지의 function_name()함수에 접근하는 방법이다. 4) link으로 지정해도 된다. 물론 자바스크립트를 제어하는 것은 아니라서 pare..
2016.01.05 -
javascript 프린트 미리보기 (IE) 기본 예제
IE 프린트 미리보기 화면 호출에 대한 예제이다. 이용 가능한 브라우저 버전은 다음과 같다. IE 5.5 이상 가능 (Test 는 IE 9~11) IE는 내장되어있는 프린트 미리보기 기능을 javascript에서 불러오는 방법이다. 크롬은 기본 프린트 호출이 미리보기이므로 분기문으로 처리한다. 혹시나 화면이 와이드이면 미리보기 화면에서 아래처럼 인쇄크기 변경으로 조정 가능하다. ※ 인쇄 미리보기 화면에서의 설정이 필요하다. 1. 페이지 설정(Alt+U) > 배경색 및 이미지 인쇄(C) 체크 2. 콘텐츠 선택(Alt+F) > 모든 프레임 50%(해상도마다 다를 수 있음) 버튼을 눌러서 미리보기를 실행하는데 에러가 나면 아래 설정이 필요하다. ※ 프린트 미리보기 기능을 사용하기 위한 설정이다. - 도구 > ..
2016.01.05 -
javascript / 함수 시간 실행 시간 체크 / 런타임 / runtime
javascript 에서 함수 또는 로직이 실행되고 종료될때 까지의 시간을 구하는 예제이다. testRunTimer()함수를 체크하고 싶은 함수 또는 로직의 시작과 끝 부분에 한번씩 호출해 주어야 한다. 자세한 설명은 주석으로 대체한다. /** 실행 시간 체크 함수 - 체크할 구간에 호출하면 됨 ex) function test(){ testRunTimer(); // 첫번째 런타임 for(var i=0; i
2016.01.05 -
[필독][기초] / function / 함수에 관한 내용 / 기초 중의 기초
자바스크립트는 한동안 개발자들의 많은 오해와 편견으로 toy language 취급을 받아 왔습니다. 누구든지 쉽게 배워 간단히 적용할 수 있다는 생각에 깊이 있는 학습이 이뤄지지 않았습니다. 하지만, 현대의 웹 애플리케이션이 시대적 요구와 사용자의 기대로 인해 점점 더 복잡한 대규모 시스템으로 발전해 나가면서 자바스크립트에 대한 관심이 크게 늘고 있습니다. 이에 자바스크립트에 대한 올바른 이해를 위해 자바스크립트에서 가장 중요한 주제인 함수에 대해 간략히 설명하겠습니다. 대부분 자바스크립트에서 함수를 설명할 때 “자바스크립트에서 함수는 first-class object(또는 citizen, value)다”라는 정의는 항상 빠지지 않고 등장하는 단골문장입니다. 하지만, first-class object에 ..
2016.01.05 -
javascript / 숫자인지 체크하기
javascript 에서 해당 문자열이 숫자인지 체크하는 예제 함수이다. 정규식을 이용해 간단히 구현되었다. function is_number(v) { var reg = /^(\s|\d)+$/; return reg.test(v); } cs 정규식에 대한 자세한 내용은 구글링을 통해 확인하는 것이 빠르다. 일반 개발에서는 굳이 다 외울 필요는 없어 보인다.
2016.01.05 -
javascript / 특정 글자수가 넘어가면 넘어가는 글자는 자르고 마지막에 대체문자 처리
javascript에서 특정 글자수가 넘어가면 화면의 UI가 깨지는 경우가 발생한다. 예를 들면 아래와 같이 메인 화면에 배너 게시판 영역을 만들면 생각보다 작은 영역이 생기고 그 영역에 표시할 수 있는 글자수는 한정적이다. 이미지는 대전시청 홈페이지에서 발췌했습니다. 이때 화면이 깨지지 않을 정도의 글자수를 파악한 뒤 나머지 글자는 대체문자(... , 등)로 처리한다. 내용 및 사용방법은 주석으로 대체한다. /** @param txt * @param len : 생략시 기본값 20 * @param lastTxt : 생략시 기본값 "..." * @returns 결과값 * * * 특정 글자수가 넘어가면 넘어가는 글자는 자르고 마지막에 대체문자 처리 * ex) 가나다라마바사 -> textLengthOverCu..
2016.01.05 -
javascript / replaceAll / 리플레이스 / 치환 / 문자열 치환
javascript에서 replaceAll을 구현한 예제이다. javascript 에서는 replaceAll 이라는 함수가 없다. replace 라는 함수는 존재 하는데 이를 이용해서 특정 문자열을 replaceAll 하는 예제를 구현하였다 String.prototype.replaceAll = function(searchStr, replaceStr) { var temp = this; while (temp.indexOf(searchStr) != -1) { temp = temp.replace(searchStr, replaceStr); } return temp; } var a = "a,aa1,2123aasd23154aa5"; alert(a.replaceAll('aa', '\n')); Colored by Col..
2016.01.05 -
javascript / 화면 엑셀 다운로드 / table / 테이블 다운로드 / excel / iframe 다운로드
먼저 다음 URL은 별도의 페이지를 만들고 그 페이지를 호출하여 엑셀 다운로드 예제이다. 참고 별도 페이지에서 엑셀 다운로드 Javascript로 화면에 그려져 있는 Table 속성을 엑셀로 다운받는 예제이다. Jsp 에서 화면에 스크립트릿이나 el, jstl 등을 이용하여 List 데이터를 가지고 table로 목록을 만들고 그 목록을 그대로 엑셀로 다운받는 예제이다. 본 예제는 이미 테이블이 그려져있는 상태를 가지고 구현되었다. 필수 : jquery, 첨부파일 js 상속 브라우저별로 다른 다운로드 방식 : ie , 그외 function downloadExcel(targetId, SaveFileName) { var browser = navigator.userAgent.toLowerCase(); // ie..
2016.01.05 -
javascript / 천단위 구분기호 / , / 1,000 / 콤마
javascript / 천단위 구분기호 / , / 1,000 / 콤마 javascript 에서 천단위 구분기호(콤마)를 입력하는 함수이다. 여러가지 방법이 있을 수 있는데 구현하기 나름이다. 귀찮은 사람은 아래 내용을 참고하길 바란다 ㅎㅎ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 function setComma ( value ) { if (value == null || value == ""){ return value; } // 소수점 분리 var valueArr = value.toString().split("."); var str = valueArr[0].toString(); str = str.replace ( /,/g ,'' ); var re..
2016.01.05