카테고리101

• 

  [JavaScript] 날짜계산 및 문자열 출력 자바스크립트의 날짜문자열을 Date로 변환해 날짜 계산을 하고 나서 다시 문자열로 변환하여 출력하는 예제이다. ▣ js_date.html ▣ 결과화면 2023년 2월 28일을 기준날짜로 하고 하루이전과 하루다음날을 계산한다. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] Base64 Encode & Decode 예제 이번 시간에는 Base64 Encode/Decode 변환 예제이다. ▣ Base64.html ▣ 페이지 로딩 ▣ Encode 버튼 클릭 테스트를 위해 위의 소스코드를 복사해서 Encode 버튼을 클릭하였다. ▣ Decode 버튼 클릭 Encode된 문자열을 입력하고 Decode 버튼을 클릭하면 위와 같이 변환된다. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 테이블에 롤오버/클릭 효과 테이블의 레코드에 롤오버/클릭 대한 처리를 제공하는 것을 TableRolloverEffect를 이용해서 구현해 보았습니다. 해당 JavaScript는 copyright 주석만 유지하면 프리로 사용가능합니다. *^^* ▣ TableRolloverEffect.html Table example 1 (Orange, Red) Name Age Position Income Gender John 37 Managing director 90.000 Male Susan 34 Partner 90.000 Female David 29 Head of production 70.000 Male Laura 29 Head of marketing 70.000 Female Kate 18 Marketing 50.000 Female Mona 2.. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 이미지 업로드 하기전 표시하기 (ImageViewer ) 아래는 프로필 페이지에서 사진을 업로드 하려고 이미지를 로컬에서 선택할 때 미리보기를 위한 코드이다. 처음엔 기본 이미지로 표시하고 있다가 이미지 파일을 선택을 하면 이미지 올리기 전에 화면에 표시된다. 브라우저 보인문제 이슈로 파일을 선택하면 C:\fakepath에서 찾으려고 한다. fakepath 문제를 해결하려면 "인터넷 옵션" 메뉴를 선택하고 "보안 탭 > 인터넷 > 사용자 지정 수준"을 선택한다. 그리고 중간 아래정도에 위치한 "파일을 서버에 업로드할 때 로컬 디렉토리 경로 포함"을 사용으로 선택한다. 아래는 전체코드이다. 이미지 업로드 : 아래는 처음에 표시되는 화면이다. 파일을 선택하면 바로 화면처럼 선택한 이미지가 표시된다. 이미지는 강제로 가로 225, 세로 225로 하였다. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 모달창에서 부모창의 함수호출 showModalDialog()로 창을 띄우고 띄워진 창에서 부모창의 함수를 호출하는 것과 returnValue 로 부모창에 다시 전달해서 값을 표시하는 것을 구현해 보았다. ▣ MainPage.html Modal Call : Return Value : ▣ ModalDialog.html Dialog Name : ▣ 페이지 로드 부모창에서 Call showModalDialog를 클릭해서 모달창을 연다. ▣ 부모창 호출 모달창에서 Parent Call 버튼을 클릭하여 부모창의 함수를 호출한다. 부모창의 Modal Call 텍스트박스에 표시가 된다. ▣ 짜잔~~~! 부모창 값전달 모달창에서 Go to Parent 버튼을 클릭하면 부모창에 값을 전달하고 창이 닫힌다. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 정규표현식 입력검증 정규표현식(Regular Expressions)을 사용하여 입력검증을 해본다. 표현식에 위배되는 값을 입력하고 버튼을 클릭하면 해당하는 항목의 정규표현식이 출력된다. 예제의 값을 입력하고 클릭하면 정상적으로 지나간다. ▣ RegExp.html 제목 예제 항목 버튼 숫자 0123456789 알파벳 Apple 영수조합 Apple123 아이디 tuser01 연락처 010-1234-1234 이메일 test@test.com ▣ 결과화면 처음 로딩하고 입력항목을 보면 표현식에 위배되는 값이 있다. ▣ 버튼 클릭 해당하는 항목의 정규표현식이 출력. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 모달창에 값 주고 받기 showModalDialog()로 창을 띄우면서 값을 전달하여 dialogArguments로 그 값을 받아보고 띄워진 창에서 returnValue 로 부모창에 다시 전달해서 값을 표시하는 것을 구현해 보았다. ▣ showModalDialog.html Return Value : ▣ dialogArguments.html Dialog Arguments : ▣ 페이지 로드 부모창의 역활을 하게 될 showModalDialog이다. ▣ 모달창 부모창에서 버튼을 클릭하면 위와 같은 모달창이 열린다. 부모창에서 던진 파라미터가 텍스트박스에 표시된다. ▣ 부모창 모달창에서 Go to parent 버튼을 클릭하면 닫히면서 부모창에 값을 던지고 부모창 텍스트박스에 표시된다. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 동적으로 테이블 생성 자바스크립트를 사용해서 테이블을 동적으로 구성해 본다. 히든항목을 두어서 중복된 코드에 대한 추가를 방지하였다. ▣ DynamicTable.html 코드 값 항목 ▣ 페이지 로드 로딩 시에 SAME_CODE로 신규로 자동추가한다. ▣ 신규코드 클릭 신규코드 버튼을 클릭해서 새로운 행을 두 개 추가한다. 이때 코드는 타임스탬프 값을 사용하였다. ▣ 같은코드 클릭 같은 코드 버튼을 클릭하면 위와 같은 메시지가 표시되고 행이 추가되지 않는다. ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 이벤트 핸들러 [2] JavaScript로 자주 사용하는 이벤트 핸들러를 구현해 본다. 페이지 로딩 시, 문서에서 기본키 설정 시, 마우스에 대한 처리를 예제로 구현해 보았다. ▣ EventHandler2.html 이벤트 대상 구분 객체 Text Checkbox all yes no Radio all yes no Select All Yes No Button Label Checkbox All Radio All 이벤트 현황 항목 값 이벤트명 *^^* 이벤트값 *^^* ▣ 페이지 로드 ▣ Text 입력 ▣ Checkbox 선택 ▣ Radio 선택 ▣ Select 선택 ▣ Button 클릭 ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 이벤트 핸들러 [1] JavaScript로 자주 사용하는 이벤트 핸들러를 구현해 본다. 페이지 로딩 시, 문서에서 기본키 설정 시, 마우스에 대한 처리를 예제로 구현해 보았다. 발생한 이벤트 이름과 값을 화면에 표시한다. ▣ EventHandler1.html 항목 값 이벤트명 *^^* 이벤트값 *^^* ▣ 페이지 로드 ▣ 마우스 클릭 ▣ 마우스 더블클릭 ▣ 엔터키 (Enter) ▣ 취소키 (Esc) ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [JavaScript] 서브메뉴 동적표시 (SubMenu.html) 서브메뉴를 동적으로 펼치고 접히는 페이지를 구현해 봅니다. 좌측 서브메뉴를 구현할때 자주 사용하는 기능이다. ▣ SubMenu.html 서브메뉴 Hello! *^^* Hello HTML. *^^* Hello JavaScript. *^^* Hello Java. *^^* ▣ 결과화면 메뉴 클릭 후 ■ Front-End ■/JavaScript 2023. 2. 28.

• 

  [Java] 메소드 호출할 때 레퍼런스 변수에서 NullPointerException이 발생하는 것을 방지 클래스 안에 다음과 같은 check 메서드가 있다고 가정해 보자. isExist와 같이 여부를 확인하기 위해 일반적으로 많이 사용하는 유형의 메서드이다. public boolean check() { boolean isCheck = false; // (중략) return isCheck; } 다음의 문장에서와 같이 객체에 있는 check 메서드의 결괏값에 따라 if 문을 수행하려는 경우 정상적인 경우는 true/false를 리턴하여 잘 수행되지만 레퍼런스변수 obj가 null일 경우에 NullPointerException이 발생한다. if(obj.check()) { // 수행문 } 따라서 아래와 같이 먼저 레퍼런스변수가 null 인지 비교를 하는 조건을 &&(And)로 연결하면 null 인 경우는 false.. 카테고리 없음 2023. 2. 27.