Developer's Life

일반적으로 유효값 체크를 하고 alert으로 메시지를 띄운 뒤 해당 element로 focus를 가게 만든다.

그런데 IE에서는 alert창을 띄우고 element.focus(); 를 주면 이상하게도 위치는 잡아주는데 input 태그의 커서가 깜빡이지 않는다.

많은 시도결과 setTimeout 으로 IE에서도 focus를 잡아줄 수가 있었다.

ex)

var title = document.getElementById("title");

if(title.value == ''){
  alert("제목을 입력해주세요.");
  setTimeout(function(){title.focus();}, 1);
  return false;
 }

이런형식으로 주면 IE, Chrome 도 포커스를 잡아준당~~

다시한번 느끼지만 IE... 참 힘들다

function addSelectBoxOption(oSelect, value, text){
 var oOption = document.createElement("OPTION");
 oOption.value = value;
 oOption.text = text;
 oSelect.options.add(oOption);
}

function addSelectBoxFirstOption(oSelect, value, text){
 var oOption = document.createElement("OPTION");
 oOption.value = value;
 oOption.text = text;
 oSelect.options.add(oOption, 0);

}

자바스크립트를 공부하려고 시작했을 때 어떤 프로그램을 사용해야 할지 고민이 생겼습니다.

메모장? 이클립스? Editplus? 

이클립스나 Editplus나 둘다 구문강조를 해주어서 좋기는 하지만 저에겐 자동완성 기능이 필요했습니다.

그래서 찾아본 결과 이클립스 플러그인 중 JSDT(JavaScript Development Tool)이 있다는 것을 알았습니다.

바로 이클립스에 설치 해 봤습니다.

먼저 이클립스의 메뉴 -> Help -> Eclipse Marketplace...

들어갑니다.

Find 에서 jsdt 검색을 하시고 JSDT jQuery Install 버튼 클릭

설치는 쉽습니다.

다른 설명은 하지 않고 그림만으로 대체하겠습니다.

이클립스 재시작까지 완료하면 설치는 끝났습니다.

이제 적용을 시켜야 합니다.

적용할 프로젝트의 JavaScript Resources 마우스 오른쪽 Properties에 들어갑니다.

JavaScript -> Editor -> Include Path 항목에서 라이브러리 추가를 해줍니다.

적용할 버전을 선택하시면 됩니다. 

저는 1.9까지 나와 있길래 1.9를 선택했습니다.

이제 적용을 끝냈으니 테스트를 해보겠습니다.

적용한 프로젝트에 Index.html 파일을 만들어서

<script type="text/javascript">

안에 $(document). 까지 치고 자동완성 단축키인 Ctrl + space 를 누르니 짜잔 하고 자~알 나타납니다.

정말 편리한 기능입니다. 만드신분 최고~!