애플리케이션 개발시 종종 구분자로 저장되어있는 문자열 키를 이용해 특정 데이터를 불러와 배열형태로
저장할 필요가 있다.
그럴 경우 아래와 같이 StringTokenizer, ArrayList, VO객체를 이용하여 List 형태로 저장할 수 있다.



List list = new ArrayList();
if(!StringUtil.isBlank(user.getCode())){
    StringTokenizer st = new StringTokenizer(user.getCode(), ",");
    int i = 0;
    while(st.hasMoreElements()) {
        UserVO userVO = UserService.getInstance().getUserInfo(st.nextToken());
        list.add(i, userVO);
        i++;
    }
}



한가지 유의할 점은 list에 객체를 담을때 parameter로 index를 객체와 함께 추가하는 메소드를 사용한다.

Posted by finewoo
,
이미지 업로드전 미리보기 스크립트코드...
일반적인 방식으로는 ie만 지원되나 아래코드로 파이어폭스, ie8버전까지 지원되는것을 확인했다.
단, 크롬은 지원안됨..

<html>
<head>
    <title></title>
    <style type="text/css">
        .preView { width: 150px; height: 150px; text-align: center; border:1px solid silver; }
    </style>
    <script type="text/javascript">

        function fileUploadPreview(thisObj, preViewer) {
            if(!/(\.gif|\.jpg|\.jpeg|\.png)$/i.test(thisObj.value)) {
                alert("이미지 형식의 파일을 선택하십시오");
                return;
            }

            preViewer = (typeof(preViewer) == "object") ? preViewer : document.getElementById(preViewer);
            var ua = window.navigator.userAgent;

            if (ua.indexOf("MSIE") > -1) {
                var img_path = "";
                if (thisObj.value.indexOf("\\fakepath\\") < 0) {
                    img_path = thisObj.value;
                } else {
                    thisObj.select();
                    var selectionRange = document.selection.createRange();
                    img_path = selectionRange.text.toString();
                    thisObj.blur();
                }
                preViewer.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fi" + "le://" + img_path + "', sizingMethod='scale')";
            } else {
                preViewer.innerHTML = "";
                var W = preViewer.offsetWidth;
                var H = preViewer.offsetHeight;
                var tmpImage = document.createElement("img");
                preViewer.appendChild(tmpImage);

                tmpImage.onerror = function () {
                    return preViewer.innerHTML = "";
                }

                tmpImage.onload = function () {
                    if (this.width > W) {
                        this.height = this.height / (this.width / W);
                        this.width = W;
                    }
                    if (this.height > H) {
                        this.width = this.width / (this.height / H);
                        this.height = H;
                    }
                }
                if (ua.indexOf("Firefox/3") > -1) {
                    var picData = thisObj.files.item(0).getAsDataURL();
                    tmpImage.src = picData;
                } else {
                    tmpImage.src = "file://" + thisObj.value;
                }
            }
        }

    </script>
</head>
<body>
    <input id="file" name="file" type="file" onchange="fileUploadPreview(this, 'preView')" />
    <div id="preView" class="preView" title="이미지미리보기"></div>
</body>
</html>


'Language > JavaScript' 카테고리의 다른 글

[Ajax] iframe 과의 요소 접근  (0) 2012.09.17
[텍스트 에디터] notepad++  (0) 2010.11.30
[JavaScript] Class 정의  (0) 2010.11.26
[Ajax] jQuery를 사용한 Ajax 구현  (0) 2009.12.29
javascript minifier  (0) 2009.12.03
Posted by finewoo
,
jQuery에서는 class로 적용된 요소를 동적으로 처리할 수 있는 함수를 제공한다.

대표적이며 가장 자주 사용되는 몇가지를 정리해본다.

#addClass(className)
- 해당 className을 가진 클래스 속성을 추가. 즉 이벤트가 발생한 노드에 선언된 클래스 스타일을 적용시킨다.


.hidden {display:none;}

$("#box").addClass("hidden");

<div id="box"></div>


#removeClass(className)
- removeClass는 addClass의 반대이다. 해당클래스 속성을 지정된 노드에서 제거해준다.
- 사용법은 addClass와 동일하다.


#toggleClass(className)
- toggleClass는 addClass와 removeClass의 기능을 모두 포함하는 메소드이다.
toggle이란 용어의 의미대로 addClass와 removeClass 함수가 toggle 형식으로 교대로 적용된다.
즉, 스타일 클래스가 적용된 경우는 제거를, 속성이 선언되어 있지 않은 경우에는 선언해주게 된다.

.hidden {display:none;}

$("#box").toggleClass("hidden");

<div id="box"></div>

위의 예제의 경우에 해당 노드에 특정 이벤트 액션을 걸어주는 경우 'hidden'이란 클래스 속성이 적용, 제거가 교대로 반복되게 된다.

  

'기타 > jQuery' 카테고리의 다른 글

jQuery CDN  (0) 2010.09.06
[jQuery] jQuery UI 로 Datepicker(날짜입력기) 구현  (0) 2010.02.09
jQuery  (0) 2009.12.29
Posted by finewoo
,