PageSourceSearch
Opt out API access

https://cdnw.tworld.co.kr/poc/inc/js/lib/wddo.selectbox-1.5.4.js

js tworld.co.kr collected 2026-09-24 08:49:30 UTC 46,829 bytes, 1,143 lines download raw bytes 

1/**
2@notice: Iframe에서 IE이슈 강제설정
3 * @since : 2016.10.26
4 *
5 * history
6 *
7 * 1.4 (2013.12.08) : -
8 * 1.4.1 (2013.12.16) : $hiddenSelect.val(selectValue) 로 변경을 알리기 때문에 option 태그에 value 값이 동일하면 정상적으로 변경되지 않는 부분 수정
9 * 1.4.2 (2014.01.22) : 리스트 a 태그 title 속성 추가
10 * 1.4.3 (2014.07.16) :
11 *                      multiText 옵션 생성하여 리스트의 텍스트의 구분자를 지정하면 span 태그로 분할 래핑
12 *                      changeText() 의 html 인자 추가
13 *                      disabledClass 옵션 추가 컨테이너 DIV에 class 적용됩니다.
14 *                      zindex 옵션 존재 시 z-index 리스트 열고 닫을 때 변경
15 *                      option 태그에 class 속성이 존재 할 경우 위에서 multiText에 의해 나누어진 span 에 차례대로 클래스가 이전된다. 단, span 당 하나의 클래스
16 * 1.4.4 (2014.08.14) : 리스트 전체 가로 크기보다 텍스트가 긴 리스트를 선택시 btn 에 영역을 넘어가 버린다 그래서
17 *                      css 에서 btnA>span 에 overflow:hidden 을 처리하면 오른쪽이 여유가 없어 btnA>span width 에 5px 를 빼주었다.
18 *                      버튼 클릭 시 selectList() 함수 비 실행으로 수정하여 select 태그 change event 발생하지 않게 수정
19 * 1.4.5 (2014.08.18) : opts.width 가 btnA에 width 였는데 따로 옵션으로 설정해줄 필요가 없어보여 container의 width 로 변경 하였다.
20 * 1.4.6 (2014.09.01) : 완료 시점에 hidden select tag 를 통하여 complete.selectbox 이벤트 발생
21 * 1.4.7 (2014.09.11) : 외부에서 메소드로 리스트 변경 시 maskDIV의 display:none으로 인하여 position().top 을 0으로 반환 직접 index로 계산으로 인한 itemHeight 변수 추가
22 * 1.4.8 (2014.09.12) : getBorderWidth() 메소드 추가하여 ul 뿐만 아니라 tweenDIV 의 좌우 border로 list의 width 값에 영향을 주게 변경
23 *                      btnA의 글자라인이 늘어나면 btnHeight 재정의하여 maskDIV top 위치 조정
24 *                      1.4.4 에 삭제된 버튼클릭 시 selectList() 호출 삭제로 인하여 버튼 클릭시 리스트 활성화 안되던것 복구
25 * 1.4.9 (2014.09.19) : getBorderHeight() 메소드 추가하여 tweenDIV, maskDIV 에 대한 높이 재정리
26 * 1.5 (2014.10.14)   : ul 에 paddingTop, paddingBottom 을 적용하여 상하 여백을 만드는 상황을 대비하여 $maskDIV 의 height 값에 더해주었다.
27 * 1.5.1 (2015.04.23) : opts.complete 와 $.SelectBoxSet() 의 3번째 인자 전체 complete 추가
28 * 1.5.2 (2015.06.18) : 최초 생성시 hidden select onchange 발생 않게 수정
29 * 1.5.3 (2015.07.02) : $hiddenSelect의 부모 div중 display: none 이면 높이 0 처리 되므로 보여줬다 .unhide_wddo를 이용하여 다시 숨김
30 * 1.5.4 (2015.08.10) : mousewheel 작동 시 이동 거리 itemHeight 1개 크기로 jScrollPane에 지정
31 *
32 * Jo Yun Ki에 의해 작성된 SelectBox은(는) 크리에이티브 커먼즈 저작자표시-비영리-동일조건변경허락 4.0 국제 라이선스에 따라 이용할 수 있습니다.
33 * 이 라이선스의 범위 이외의 이용허락을 얻기 위해서는 [email protected]을 참조하십시오.
34 *
35 */
36
37
38/********************************************************************************************/
39/***************************************** selectbox ****************************************/
40/********************************************************************************************/
41
42/**
43* 디자인 셀렉트 박스 (div >> a, div >> ul 구조), (select 태그 기반)
44*
45* 1.  jQuery 라이브러리 로드후 실행
46* 2.  모든 메소드는 document ready 후 실행 하여야 한다.
47* 3.  $.SelectBoxSet 를 실행하면 내부적으로 document ready 후 실행한다.
48* 4.  select 태그에 onchange 이벤트가 발생하면 디자인 셀렉트 박스에 전달된다. $hiddenSelect.bind('change.selectbox', function (e) {});
49*     단 selectIndex나 value 변경 시 onchange 발생 안하므로 change 이벤트 발생시켜 줘야 함
50* 5.  select 의 속성 변화(disabled, selected)는 select 태그에 적용후 .resetSB() 를 실행
51* 6.  select 태그가 없는 디자인 셀렉트 박스는 $('target').on('change.selectbox', function (e, param) {} 로 반환값을 전달 받는다.
52* 7.  select 태그 기반으로 작성시 반드시 option 태그에 value 속성 존재하여야 한다. 디자인 셀렉트 에선 li 에 data-value 로 저장된다.
53* 8.  지정 높이가 리스트보다 작으면 자동 스크롤바 생

53성(http://jscrollpane.kelvinluck.com/)
54* 9.  1.4 버전에서 IE6 지원하지 않음
55* 10. 리스트의 가로 사이즈를 변경하고자 한다면 css .maskDiv_wddo 의 padding-right 나 margin-right 로 조절한다.
56* 11. 스크롤의 여백 조절은 좌.우 는 css .jspVerticalBar 의 left:0;padding-left, right:0;padding-right 를 조절하며 상단 하단 여백 높이는 css .jspCapTop .jspCapBottom 의 height 로 조절
57* 12. 리스트를 2줄이상으로 보이게 하려면 css white-space: nowrap; 삭제
58* 13. 리스트의 상하 여백은 padding-top, padding-bottom 으로 조절한다.
59*
60* ex)
61*
62*   1. 한꺼 번에 적용
63*
64*       $.SelectBoxSet('select', {height: 200}); // select 태그 기반으로 할 경우
65*
66*       - target (jQuery Selectors)
67*               경우1. select 태그
68*               경우2. div >> a, div >> ul 구조의 상위 DIV (UL > LI 에 data-value 속성 없으면 자동 pulldown menu 형태)
69*
70*   2. 하나씩 적용
71*
72*       var options = {
73*           height: 200
74*       };
75*
76*       var selectBox = new SelectBox('div.select', options); // select 태그 기반이 아닌 경우엔 div.select 를 target으로 삼는다.
77*
78*       $(function () {
79*           selectBox.initSB();
80*       });
81*
82*   3. 옵션 (: 기본값)
83*
84*       var option = {
85*           width: undeinfed,           //셀렉트 가로 크기
86*           height: undefined,          //스크롤바 한계높이
87*           direction: 'down',          //열리는 방향 'up'|'down'
88*           speed: 250,                 //기본 속도. 닫힐땐 이보다 절반의 속도로 닫힘
89*           aClass: 'on',               //LI의 A 태그 오버효과를 담당할 클래스 명
90*           divClass: 'select',         //컨테이너 DIV 태그 클래스 명
91*           btnClass: 'tit',            //클릭할 A 태그의 클래스명
92*           conClass: 'overcon',        //UL 감싸고 있는 DIV 클래스명
93*           ulClass: 'con',             //UL 클래스명
94*           disabledClass: undefined    //비활성화 클래스
95*           autoClose: false,           //pulldown 인 경우 리스트에서 포커스가 빠지면 자동으로 닫힐지 유무
96*           multiText: undefined,       //텍스트에 구분자를 지정하여 <span 태그로 래핑
97*           zindex: 840212,             //열릴 때 z-index 값
98*           complete : undefined        //생성완료 콜백 함수
99*       };
100*
101*   4. 메서드
102*
103*       //디자인 기반의 셀렉트 박스
104*       var instance = $('div.select').getInstance();
105*
106*       .getTarget();               //jQueryObject 형태로 컨테이너 DIV 반환
107*       .getInfoSB();               //정보반환, change 이벤트의 param 와 같음
108*       .setIndexSB(idx);           //index로 선택
109*       .getIndexSB();              //index 반환
110*       .setValueSB(value);         //value로 선택
111*       .getValueSB()               //value 반환
112*       .setTextSB(value);          //text로 선택
113*       .getTextSB();               //text 반환
114*       .disabledSB(boolean);       //disabled
115*       .removeSB();                //디자인 셀렉트 삭제
116*       .resetSB();                 //select 태그를 토대로 재적용
117*
118*       //기본 셀렉트 박스
119*       $('select').val('value2').change();
120*       $('select').prop('selectedIndex', 3).change();
121*
122*       $('select')[0].value = "value2";
123*       $('select')[0].selectedIndex = 3;
124*       $('select').change();
125*
126*   5. 이벤트
127*
128*       //디자인 기반의 셀렉트 박스
129*       $('.select').bind('change.selectbox', function (e, param) {
130*           console.log('change index: ' + param.index);
131*           console.log('change value: ' + param.value);
132*           console.log('change text: ' + param.text);
133*       });
134*
135*       //기본 셀렉트 박스
136*       $('select').bind('change.selectbox', function (e) {
137*           console.log($(this).val());
138*       });
139*
140*   6. HTML
141*
142*    <div class="select">
143*       <a href="#" class="tit"><span>선택해주세요</span></a>
144*       <div class="overcon">
145*           <ul class="con">
146*               <li><a href="#" data-value="list1_0">선택하세요</a></li>
147*               <li><a href="#" data-value="list1_1">리스트1</a></li>
148*               <li><a href="#" data-value="list1_2">리스트2</a></li>
149*               <li><a href="#" data-value="list1_3">리스트3</a></li>
150*           </ul>
151*           <div class="selectL"></div>
152*           <div class="selectR"></div>
153*       </div>
154*   </div>
155*
156*   7. CSS(기본 템플릿)
157*
158*       .select {position:relative;}
159*       .select .tit {display:block;height:33px;background:url(img/common/bg_selectL.png) no-repeat left top;}
160*       .select .tit > span {display:inline-block;overflow:hidden;margin-left:15px;padding:10px 40px 10px 0;height:13px;background:url(img/common/bg_selectR.png) no-repeat right top;white-space: nowrap;}
161*       .select .tit.on {background:url(img/common/bg_selectLon.png) no-repeat left top;}
162*       .select .tit.on > span {background:url(img/common/bg_selectRon.png) no-repeat right top;}
163*       .select .overcon .con {padding:5px 0 15px;border-left:1px solid #ccc;border-right:1px solid #ccc;border-bottom:1px solid #ccc;background:#fff;}
164*       .select .overcon .con a {display:block;padding:5px 15px 5px 15px;white-space: nowrap;}
165*       .select .overcon .con a.on {background:#f1f1f1;}
166*       .select .overcon .selectL {width:16px;height:16px;background:url(img/common/bg_selectconL.gif) no-repeat;}
167*       .select .overcon .selectR {width:16px;height:16px;background:url(img/common/bg_selectconR.gif) no-repeat;}
168*
169*       .jspContainer{overflow:hidden;position:relative;}
170*       .jspPane{position:absolute;}
171*       .jspVerticalBar{position:absolute;top:0;right:0;width:8px;height:100%;background:red;}
172*       .jspTrack{background:#ccc;position:relative;}
173*       .jspDrag{background:#999;position:relative;top:0;left:0;cursor:pointer;}
174*       .jspCapTop{height:0px;}
175*       .jspCapBottom{height:0px;}
176*
177*
178* 2016.06.02
179* 키보드 상하 이동 연속적인 disabled옵션이 있을 경우 선택되는 버그 수정
180*
181* 2016.09.02
182* defaultOptions zindex  840212->4800으로 변경
183*
184* 2016.09.12
185* commonJs.event.SELECTBOX_INIT 추가
186*
187* 2017.12.28
188* 키보드 사용성 수정 (엔터키로 리스트 내용 보기 및 탭키 이동시 처리 추가)
189*
190* 2018.02.07
191* [#6141] [공통] 셀렉트 박스 오류 수정건 (오류수정)
192*
193* 2018.02.28
194* [#6141] [공통] 셀렉트 박스 오류 수정건 (오류수정)
195*
196* 2018.03.22
197* 셀렉트 박스 키보드 접근시 마우스 접근과 동일하게 수정.
198*
199* 2018.06.28

200* 옵션이 2개 이하일 경우 동작 버그 수정
201*
202* 2019.07.10
203* 190712 2019웹접근성 수정
204*
205* 2019.09.11
206* 190911 disabled시 target을 a 버튼으로 고정
207*
208* 2024.03.22
209* 240322 accordion 내 select 있을때 detail 영역에 style="display: none;" 추가 방지
210*
211*/
212
213var SelectBox = (function ($) {
214    var wddoObj = function (_target, _options) {
215        var scope,                      //현 함수의 인스턴트
216            $container,                 //디자인 selectBox와 히든 input 을 담고 있는 컨테이너
217            $target,                    //div >> a, ul 형태를 가지고 있는 DIV
218            $btnA,                      //열고 닫기를 할 버튼 a
219            $listCon,                   //리스트 ul 감싸고 있는 DIV
220            $listUL,                    //리스트 ul
221            $listA,                     //li 속 a
222            $roundDIV,                  //ul 하단 라운드 레이아웃 담당하는 DIV x2
223            $maskDIV,                   //트윈 DIV 를 감싸고 영역밖으로 overflow:hidden; 인 마스크 DIV
224            $tweenDIV,                  //트윈이 일어나는 DIV
225            $hiddenSelect,              //숨겨진 <select> 태그
226            itemWidth,                  //리스트안에 li 아이템 넓이
227            itemHeight,                 //리스트안에 li 아이템 높이
228            listWidth,                  //리스트 최종적 넓이(ul tweenDiv border 포함)
229            listHeight,                 //리스트의 스크롤링 되지 않은 최종적 높이
230            btnWidth,                   //열고 닫기를 할 버튼의 넓이
231            btnHeight,                  //열고 닫기를 할 버튼의 높이
232            isValue,                    //<select> 형태일지 pulldown 형태일지 결정할 변수
233            isScroll = false,           //jScroll 적용시 높이보다 리스트가 작으면 스크롤이 생기지 않는것 감안하여 스크롤바가 있는지 없는지 유무
234            isDisabled = false,         //<select> tag 에 disabled 되었는지 유무
235            isEvent = false,            //이벤트가 적용되었는지 유무
236            isFocus = false,
237            opts,
238            defaults = defaultOptions(),//기본값
239            selectIndex,                //selectbox 의 인덱스 넘버
240            selectText,                 //selectbox 의 레이블명
241            selectValue,                //selectbox 의 숨은 값 <li data-value:
242            jscroll,                    //jScroll 인스턴트
243            zindex;                     //$target 부모의 zindex 값
244
245        var IE7Check;               //ie7 체크  sk전용
246
247        function defaultOptions() {
248            return {
249                height: undefined,
250                width: undefined,
251                direction: 'down',
252                speed: 250,
253                aClass: 'on',
254                divClass: 'select',
255                btnClass: 'tit',
256                conClass: 'overcon',
257                ulClass: 'con',
258                disabledClass: 'selDisabled',
259                autoClose: false,
260                multiText: undefined,
261                zindex: 4800,
262                complete: undefined
263            };
264        }
265
266        //init
267        function init() {
268            opts = $.extend(defaults, _options);
269
270            createLayout();
271
272            $container = $target.parent();
273            $btnA = $target.find('a:eq(0)');
274            $listCon = $target.find('div:eq(0)');
275            $listUL = $listCon.find('ul');
276            $listA = $listUL.find('li > a');
277            $roundDIV = $listCon.find('> div');
278
279            isValue = ($listA.data('value') !== undefined) ? true : false;
280        }
281
282        //<select> tag choose
283        function createLayout() {
284            if ($target.is('select')) {
285                $hiddenSelect = $target;
286                $hiddenSelect.data('select', true);
287                var con, ul, li, a;
288                var title = ($target.attr("title") !== undefined) ? $target.attr("title") : '';
289                var text, cls, htmlText, textArr, classArr;
290
291                //$target : <select> tag -> <div> tag
292                $target = $hiddenSelect.before('<div class="' + opts.divClass + '"><span class="hidden">키보드 방향키로 목록 선택</span> <a href="#" class="' + opts.btnClass + '" title="' + title + '" role="combobox"><span></span></a></div>').prev(); // 190712 2019웹접근성 수정 //240716 [MOZOP002-35442]
293

294                con = $target.append('<div class="' + opts.conClass + '"></div>').find('div');
295                ul = con.append('<ul class="' + opts.ulClass + '"></ul>').find('ul');
296                con.append('<div class="selectL"></div><div class="selectR"></div>').find('> div'); //round layout
297
298                $hiddenSelect.find('option').each(function () {
299                    text = $(this).text();
300                    if( $(this).attr('disabled') ){
301                        li = ul.append('<li><a title="' + text + ' 선택" class="disabled"></a></li>').find('li:last');
302                    }else{
303                        li = ul.append('<li><a title="' + text + ' 선택" href="#"></a></li>').find('li:last');
304                    }
305                    a = li.find('> a');
306                    textArr = (opts.multiText === undefined) ? [text] : text.split(opts.multiText);
307                    classArr = ($(this).attr('class') === undefined) ? [] : $(this).attr('class').split(' ');
308                    htmlText = '';
309
310                    //multi text
311                    $(textArr).each(function (idx){
312                        cls = (classArr[idx] !== undefined) ? classArr[idx] : '';
313                        htmlText += '<span' + ( (classArr.length !== 0) ? ' class="' + cls + '"' : '' ) + '>

313' + textArr[idx] + '</span>';
314                    });
315
316                    a.html(htmlText).data('value', $(this).attr('value'));
317                });
318
319                $hiddenSelect.css('display', 'none');
320            }
321        }
322
323        //init layout
324        function initLayout() {
325            //width - width();
326            //height - outerHeight();
327            //roundDIV exception
328
329            zindex = $container.css('z-index');
330
331            //add 1.5.3
332            $hiddenSelect.parents().filter(function () {
333                return $(this).css('display') === 'none'
334            }).show().addClass('unhide_wddo');
335
336            $listCon.css('display', 'block');
337            $tweenDIV = $listCon.wrap('<div class="maskDiv_wddo" style="*position: relative;"><div class="tweenDiv_wddo">').parent();
338            $maskDIV = $tweenDIV.parent();
339
340            var li = $listUL.find('> li:first');
341            var bwListUL = getBorderWidth($listUL);
342            var bwTweenDIV = getBorderWidth($tweenDIV);
343            var bhListUL = getBorderHeight($listUL);
344            var bhTweenDIV = getBorderHeight($tweenDIV);
345
346
347            //container //add 1.4.5
348            if (opts.width === undefined) opts.width = $container.width();
349            $container.css('width', opts.width); //fix selectbox width
350
351
352            //btn
353
354            btnWidth = $btnA.width();
355            btnHeight = $btnA.outerHeight();
356
357			//#yeshtml5
358			if(btnWidth<=10){
359				btnWidth=101;
360			}
361
362            //btn A > span blank // - 5 add 1.4.4
363            var btnAMultiLine = $btnA.find('> span').css('white-space') !== 'nowrap';
364            var btnABlank = (opts.width !== undefined) ? 5 : 0;
365            $btnA.find('> span').css(((!btnAMultiLine) ? 'width' : 'paddingRight'), ((!btnAMultiLine) ? (btnWidth - btnABlank) : btnABlank));
366
367            //item //add 1.4.7
368            itemWidth = li.width();
369            itemHeight = li.outerHeight();
370
371            //list
372            listWidth = itemWidth + bwListUL + bwTweenDIV;
373            listHeight = ($listUL.children().length * itemHeight) + bhListUL; //$listUL.outerHeight(); crossbrowser error
374
375			//#yeshtml5
376			//if(itemWidth<=100){itemWidth=141;}  // 2018.02.07 [#6141] [공통] 셀렉트 박스 오류 수정건 (오류수정)
377			//if(listWidth<=100){listWidth=143;}  // 2018.02.07 [#6141] [공통] 셀렉트 박스 오류 수정건 (오류수정)
378			if(listHeight<=100){listHeight='100%';}
379
380            $roundDIV.css({
381                'position' : 'relative',
382                'marginTop' : -$roundDIV.outerHeight()
383            }).filter(':eq(1)').css({'marginLeft' : listWidth - $roundDIV.outerWidth()});
384
385            $tweenDIV.css({
386                'height' : listHeight
387            });
388
389            $maskDIV.css({
390                'position' : 'absolute',
391                'overflow' : 'hidden',
392                'left': '0',
393                'top' : btnHeight,
394                'width' : listWidth,
395                'height' : listHeight + parseInt($listUL.css('paddingTop')) + parseInt($listUL.css('paddingBottom')) //list top&bottom space //add 1.5
396            });
397
398            //IE7-
399            IE7Fix();
400
401            //scroll apply
402            addScroll();
403
404            //add scroll : layout reset
405            if (isScroll) {
406
407                itemWidth = li.width();
408                listWidth = itemWidth + bwListUL + bwTweenDIV;
409                $roundDIV.filter(':eq(1)').css({'marginLeft' : listWidth - $roundDIV.outerWidth()});
410                $maskDIV.css('height', opts.height);
411                $tweenDIV.css('height', opts.height);
412            }
413
414            //auto direction add 1.5.5
415            if(opts.autoDir){
416                opts.direction=getDirection();
417            }
418
419            //direction
420            modifyDirection();
421
422            //skt 추가
423            if( !IE7Check && $container.hasClass('selType2'))
424            {

425                var w = $target.children('.tit').children('span').outerWidth();
426                $target.children('.tit').children('span').css('width','auto');
427                $target.parent().css('width', (60+w)+'px' );
428            }
429        }
430
431        //get direction // add 1.5.5
432        function getDirection(){
433            var frm=$(opts.dirFrmSelector);
434            var cHeight=$container.offset().top+$container.outerHeight(true)+opts.height;
435            var bHeight=$("body").height();
436
437            if(bHeight<=cHeight) return "up";
438            else return "down";
439        }
440
441        //get border left, right //add 1.4.8
442        function getBorderWidth(_target) {
443            //ie8- css 'border-left-width' 'border-right-width' default value 'medium'
444            var borderLeftWidth = parseInt(_target.css('border-left-width')) | 0;
445            var borderRightWidth = parseInt(_target.css('border-right-width')) | 0;
446
447            return borderLeftWidth + borderRightWidth;
448        }
449
450        //get border top, bottom //add 1.4.9
451        function getBorderHeight(_target) {
452            //ie8- css 'border-top-width' 'border-bottom-width' default value 'medium'
453            var borderTopHeight = parseInt(_target.css('border-top-width')) | 0;
454            var borderBottomHeight = parseInt(_target.css('border-bottom-width')) | 0;
455
456            return borderTopHeight + borderBottomHeight;
457        }
458
459        //IE7 fixed
460        function IE7Fix() {
461            var agt= navigator.userAgent.toLowerCase();
462
463            if (agt.indexOf("msie 7" ) != -1) {
464                $btnA.css('cursor', 'pointer');
465                //===============skpoc 전용=================
466                IE7Check = true;
467                //=======================================
468            }
469        }
470
471        //add scroll-pane
472        function addScroll() {
473            if (opts.height !== undefined && opts.height < listHeight) {
474                var pane = $listCon.show().wrap('<div class="scroll-pane"></div>').parent();
475
476
477                pane.css({
478                    'overflow' : 'auto',
479                    'height' : opts.height
480                });
481                //$('.jspCapTop').css('height','0');
482                //$('.jspCapBottom').css('height','0');
483
484                //pane.on('jsp-initialised', function (e, _isScroll) {
485                pane.bind('jsp-initialised', function (e, _isScroll) {
486                    isScroll = _isScroll;
487
488                    if (isScroll) {
489                        //non .jspPane scroll padding
490                        var jspPane = pane.find('.jspPane');
491                        var bwTweenDIV = getBorderWidth($tweenDIV);
492
493                        jspPane.css('width', listWidth - bwTweenDIV);
494
495                        /*
496                        pane.find('.jspVerticalBar>.jspCapTop').css('height','0');
497                        pane.find('.jspVerticalBar>.jspCapBottom').css('height','0');
498                        pane.find('.jspVerticalBar>.jspTrack').css('height','100%');
499                        */
500                    }
501                });
502
503                //create jscroll
504                jscroll = pane.jScrollPane({
505                    /*

506                    showArrows: false,
507                    verticalDragMinHeight: 30,  //min height with vertical scroll bar
508                    mouseWheelSpeed: itemHeight //mousewheel distance //add 1.5.4
509                    */
510                });
511                /*
512                $('div.scroll-pane').css({
513                     'overflow' : 'auto',
514                    'height' : opts.height
515                });
516                */
517
518                pane.attr('tabIndex', -1);
519            }
520        }
521
522        //add direction
523        function modifyDirection() {
524            if (opts.direction !== 'down') {
525               $maskDIV.css({
526                    'marginTop': -$maskDIV.outerHeight() - btnHeight
527               });
528            }
529        }
530
531        function open(_isOpen, _speed) {
532            var speed = (_speed !== undefined) ? _speed : ((_isOpen) ? opts.speed : opts.speed / 2);
533            var direction = (opts.direction === 'down') ? -1 : 1;
534
535            if (_isOpen) $container.css('z-index', opts.zindex);
536
537            if ($tweenDIV.length !== 0) {
538                var top = (_isOpen) ? 0 : $maskDIV.outerHeight() * direction; //open 0
539
540                if (speed > 1) {
541                    $maskDIV.add($listCon).show();
542                }//else default close
543
544                $tweenDIV.stop().animate({
545                    'marginTop': top
546                },{queue:false, duration:speed, complete:comp});
547            }
548
549            //complete
550            function comp () {
551                if (!_isOpen) {
552                    $maskDIV.hide();
553                    removeDocumentEvent();
554                    $btnA.removeClass(opts.aClass);
555                    $container.css('z-index', zindex);
556                } else {
557                    addDocumentEvent();
558                }
559            }
560        }
561
562        //document event
563        function addDocumentEvent() {
564            //$(document).on('click.selectbox', function (e) {
565            $(document).bind('click.selectbox', function (e) {
566                var currentTarget = $(e.currentTarget);
567                var target = $(e.target);
568                var isOpen = ($target.data('state') === 'open');
569                if (!target.hasClass('jspDrag') && isOpen) {
570                    if( target.attr('class') != 'jspTrack'){
571                        changeBtnState(false);
572                    }
573                }
574            });
575        }
576
577        function removeDocumentEvent() {
578            //$(document).off('click.selectbox');
579            $(document).unbind('click.selectbox');
580        }
581
582        //event
583        function initEvent() {
584            isEvent = true; // 2018.02.28
585            isFocus = false; // 2018.02.28
586
587            //btn a handler
588            //$btnA.on('click.selectbox', function (e) {
589            $btnA.bind('click.selectbox', function (e) {
590
591                var target = $(e.currentTarget);
592                var toggle = ($target.data('state') !== 'open'); //true : open
593
594                changeBtnState(toggle); //open & close
595                //if (selectIndex !== undefined && toggle) selectList($listA.eq(selectIndex)); //list on, if open // delete 1.4.4
596                if (selectIndex !== undefined && toggle) $listA.eq(selectIndex).triggerHandler('mouseover.selectbox'); // add 1.4.8
597                if ((!isValue && jscroll !== undefined) && toggle) changeScroll(0); //if pulldown menu & jscroll
598
599                e.preventDefault();
600            });
601
602            // 셀렉트 박스 포커스 아웃시 리스트 닫기 - 2017-12-28 추가
603            /* 2018.06.28 옵션이 2개 이하일 경우 동작 버그 수정으로 인하여 제거
604            $btnA.parent().bind('focusin.selectbox focusout.selectbox', function (e) {
605                isFocus = (e.type === 'focusin') ? false : true;
606                setTimeout(function () {
607                    isFocus && changeBtnState(false, 200);
608                }, 100);
609            });
610            */
611
612            //<select> version
613            if (isValue) {
614                //$btnA.add($listA).on('keydown.selectbox', function (e) {
615                $btnA.add($listA).bind('keydown.selectbox', function (e) {
616                    var target = $(e.currentTarget);
617                    var keyCode = e.keyCode;
618                    var idx = scope.getIndexSB() || 0;
619                    var altOpen = (e.altKey && (keyCode == 40 || keyCode == 38));
620                    var isOpen = ($target.data('state') === 'open');
621
622                    //alt open
623                    if (altOpen && !isOpen) {
624                        changeBtnState(true, 400);
625                        selectList($listA.eq(idx));
626                        e.preventDefault();
627                        return false;

628                    }
629
630                    //enter, btn focus
631                    if (keyCode === 13 && target.is($btnA)) {
632                        //e.preventDefault();
633                        //if (isOpen) changeBtnState(false);
634
635                        e.preventDefault();
636                        changeBtnState(!isOpen);
637                        /* 2018.03.22 셀렉트 박스 키보드 접근시 마우스 접근과 동일하게 수정. */
638                        //selectList($listA.eq(idx));
639
640                        if (selectIndex !== undefined && !isOpen) $listA.eq(selectIndex).triggerHandler('mouseover.selectbox'); // add 1.4.8
641                        if ((!isValue && jscroll !== undefined) && !isOpen) changeScroll(0); //if pulldown menu & jscroll
642                        /* //2018.03.22 셀렉트 박스 키보드 접근시 마우스 접근과 동일하게 수정. */
643                    }
644
645                    //tab, is open - 탭키이벤트 제어 풀기
646                    if (keyCode === 9 && isOpen) {
647                        e.preventDefault();
648                        changeBtnState(false);
649                    }
650
651                    //end, pagedown
652                    if (keyCode === 35 || keyCode === 34) {
653                        idx = $listA.length - 1;
654                        if( $listA.eq(idx).closest('a').attr('class') == 'disabled' ){
655                            selectList($listA.eq(idx-1));
656                        }else{
657                            selectList($listA.eq(idx));
658                        }
659                        e.preventDefault();
660                    }
661
662                    //down, right
663                    if (keyCode === 40 || keyCode === 39) {
664                        if (idx < $listA.length - 1 && scope.getIndexSB() !== undefined) idx += 1; //not label
665
666                        for(idx;idx<$listA.length;idx++){
667                            if( $listA.eq(idx).closest('a').attr('class') != 'disabled' ) break;
668                        }
669
670                        if(idx<$listA.length) selectList($listA.eq(idx));
671                        /*
672                        if( $listA.eq(idx).closest('a').attr('class') == 'disabled' ){
673                            if( ($listA.size()-1) != idx  ){
674                                selectList($listA.eq(idx+1));
675                            }
676                        }else{
677                            selectList($listA.eq(idx));
678                        }*/
679                        e.preventDefault();
680                    }
681
682                    //home, pageup
683                    if (keyCode === 36 || keyCode === 33) {
684                        idx = 0;
685                        if( $listA.eq(idx).closest('a').attr('class') == 'disabled' ){
686                            selectList(1);
687                        }else{
688                            selectList($listA.eq(idx));
689                        }
690                        e.preventDefault();
691                    }
692
693                    //up, left
694                    if (keyCode === 38 || keyCode === 37) {
695                        if (idx > 0) idx -= 1;
696
697                        for(idx;idx>-1;idx--){
698                            if( $listA.eq(idx).closest('a').attr('class') != 'disabled' ) break;
699                        }
700
701                        if(idx>-1) selectList($listA.eq(idx));
702                        // if (idx > 0) idx -= 1;
703                        // if( $listA.eq(idx).closest('a').attr('class') == 'disabled' ){
704                        //  if( ($listA.size()-1) != 0  ){
705                        //      selectList($listA.eq(idx-1));
706                        //  }
707                        // }else{
708                        //  selectList($listA.eq(idx));
709                        // }
710                        e.preventDefault();
711                    }
712                });
713
714                if ($hiddenSelect !== undefined) {
715                    //<select> tag change -> selecbox change
716                    $hiddenSelect.bind('change.selectbox', function (e) {
717                        //selectList() copy
718                        var target = $listA.eq($hiddenSelect[0].selectedIndex);
719                        var text = target.text();
720                        var html = target.html();
721                        var value = target.data('value');
722                        var idx = target.closest('li').index();
723
724                        if (isDisabled) return false;

725
726                        selectIndex = idx;
727
728                        $listA.eq(selectIndex).triggerHandler('mouseover.selectbox');
729
730                        changeText(text, html);
731                        changeValue(value);
732                        changeScroll();
733                    });
734                }
735
736            } else {
737            //pulldown menu version
738                if (opts.autoClose) {
739                   //$listA.on('focusin.selectbox', function (e) {
740                    $listA.bind('focusin.selectbox', function (e) {
741                        changeBtnState(true);
742                   });
743
744                   //$listA.on('focusout.selectbox', function (e) {
745                    $listA.bind('focusout.selectbox', function (e) {
746                        changeBtnState(false);
747                   });
748                }
749            }
750
751            //list a handler
752            //$listA.on('click.selectbox', function (e) {
753            $listA.bind('click.selectbox', function (e) {
754                var target = $(e.currentTarget);
755                if( !$(target).hasClass('disabled') )
756                {
757                    if (isValue) {
758                        e.preventDefault();
759
760                        selectList(target);
761                        changeBtnState(false);
762                        $btnA.focus();
763                    }
764                }
765            });
766
767            //$listA.on('mouseover.selectbox focusin.selectbox', function (e) {
768            $listA.bind('mouseover.selectbox focusin.selectbox', function (e) {
769                var target = $(e.currentTarget);
770                var idx = target.closest('li').index();
771
772                //all remove class form list <A> & add class
773                $listA.removeClass(opts.aClass).eq(idx).addClass(opts.aClass);
774            });
775        }
776
777        function removeEvent() {
778            isEvent = false;
779            /**
780            $listA.off('.selectbox');
781            $btnA.off('.selectbox');
782            $(document).off('.selectbox');
783            if ($hiddenSelect !== undefined) $hiddenSelect.off('.selectbox');
784            **/
785            $listA.unbind('.selectbox');
786            $btnA.unbind('.selectbox');
787            $(document).unbind('.selectbox');
788            if ($hiddenSelect !== undefined) $hiddenSelect.unbind('.selectbox');
789        }
790
791        //init attribute from <select>
792        function initAttribute() {
793            //select first
794            if ($hiddenSelect !== undefined) {
795                var selectedIdx = ($hiddenSelect.find('> option:selected').length > 0) ? $hiddenSelect.find('> option:selected').index() : 0;
796
797                //scope.setIndexSB(selectedIdx); // remove 1.5.2
798                changeBtnState(true, 0);
799                selectList($listA.eq(selectedIdx), 1);
800                changeBtnState(false, 0);
801
802                isDisabled = $hiddenSelect.prop('disabled');
803
804                scope.disabledSB(isDisabled);
805
806                $hiddenSelect.trigger('complete.selectbox'); // add 1.4.6
807            } else {
808                scope.disabledSB(false);
809            }
810        }
811
812        //select list & close
813        function selectList(_target, _first) {
814            var target = _target;
815            var text = target.text();
816            var html = target.html();
817            var value = target.data('value');
818            var idx = target.closest('li').index();
819            var isFirst = _first || 0; // add 1.5.2
820
821            if (isDisabled) return false;
822
823            if (isValue) {
824                //idx save
825                selectIndex = idx;
826
827                $listA.eq(selectIndex).triggerHandler('mouseover.selectbox');
828
829                changeText(text, html);
830                changeValue(value);
831                changeScroll();
832                if (!isFirst) changeHiddenSelect();
833            } else {
834                changeScroll(0); //init scroll ypos
835            }
836
837             //===============skpoc 전용=================
838            if( IE7Check == undefined) IE7Fix();
839            if( !IE7Check && $container.hasClass('selType2'))
840            {

841                var w = $target.children('.tit').children('span').outerWidth();
842                $target.children('.tit').children('span').css('width','auto');
843                $target.parent().css('width', (60+w)+'px' );
844            }
845            // ======================================
846
847            //event binding
848            $target.trigger('change.selectbox', scope.getInfoSB());
849        }
850
851        //change btn state
852        function changeBtnState(_value, _speed) {
853            var speed = _speed;
854            if (isDisabled) return false;
855
856            $listA.removeClass(opts.aClass);
857
858            if (_value) { //open
859                $target.data('state', 'open');
860                open(true, speed);
861                $btnA.addClass(opts.aClass);
862            } else { //close
863                $target.removeData('state');
864                open(false, speed);
865                //$btnA.removeClass(opts.aClass); //code move: motion complete
866            }
867        }
868
869        //text change
870        function changeText(_txt, _html) {
871            $btnA.children().html(_html);
872
873            //btnA multiline //add 1.4.8
874            btnHeight = $btnA.outerHeight();
875            if (opts.direction === 'down') $maskDIV.css('top', btnHeight);
876
877            selectText = _txt;
878        }
879
880        //value change
881        function changeValue(_value) {
882            selectValue = _value;
883        }
884
885        //scroll move
886        function changeScroll(_ypos) {
887            if ($target.find('.jspDrag').length > 0) {
888                var ypos = (_ypos !== undefined) ? _ypos : itemHeight * selectIndex;
889
890                jscroll.data('jsp').scrollToY(ypos);
891            }
892        }
893
894        //<select> tag change
895        //selecbox change -> <select>
896        function changeHiddenSelect() {
897            if ($hiddenSelect !== undefined) {
898                $hiddenSelect.find('option').removeAttr('selected').eq(selectIndex).prop('selected', true).end().end().trigger('change.selectbox');
899                //$hiddenSelect.val(selectValue).trigger('change'); // error : <option> attribute "value" same
900            }
901        }
902
903        //tab
904        var getTab = function (keydownEvent) {
905            var e = keydownEvent,
906                isDown;
907
908            if (e.keyCode === 9) {
909                isDown = (e.shiftKey) ? false : true;
910            } else {
911                isDown = undefined;
912            }
913
914            return isDown;
915        };
916
917        //public
918        //init
919        this.initSB = function () {
920            $target = (_target.jquery === undefined) ? $(_target) : _target;
921
922            if ($target.length > 0) {
923                if ($target.is('select') && $target.data('select') !== undefined) return false;  //avoid duplication
924
925                scope = this;
926
927                init();
928                initLayout();
929
930                //scope
931                $target.data('scope', scope);
932
933                initAttribute();
934
935                // 240322 [MOZOP002-33276]
936                if($hiddenSelect.parents('.unhide_wddo').hasClass('accordionDetail')) {
937                    $hiddenSelect.parents('.unhide_wddo').removeClass('unhide_wddo').css('display', '');
938                } else {
939                    $hiddenSelect.parents('.unhide_wddo').hide().removeClass('unhide_wddo'); //add 1.5.3
940                }
941
942                if (opts.complete !== undefined && typeof opts.complete === 'function') opts.complete();
943            }
944        };
945
946        //reset
947        this.resetSB = function () {
948            scope.removeSB();
949            scope.initSB();
950        };
951
952        //dispose
953        this.removeSB = function () {
954            //remove animate infomation
955            $listCon.parent('div').stop().css('marginTop', '');
956
957            //remove scroll source
958            if (jscroll !== undefined) {
959                jscroll.data('jsp').destroy();
960                $listCon.unwrap('<div>');
961            }
962
963            //remove mask source
964            $listCon.unwrap('<div>').unwrap('<div>');
965
966            //remove event
967            removeEvent();
968
969            //init
970            selectIndex = undefined;
971            selectText = undefined;
972            selectValue = undefined;
973            jscroll = undefined;
974            zindex = undefined;
975
976            $target.removeData('scope');
977            $target.removeData('state');
978            $listA.removeClass(opts.aClass);
979            $btnA.removeClass(opts.aClass);
980            $listCon.hide();
981
982            if ($hiddenSelect !== undefined) {
983                $hiddenSelect.css('display', '');
984                $hiddenSelect.siblings('div.' + opts.divClass).remove();
985                $hiddenSelect.removeData('select');
986            }
987
988            //scope = undefined;
989            $container = undefined;
990            $target = undefined;
991            $btnA = undefined;
992            $listCon = undefined;
993            $listUL = undefined;
994            $listA = undefined;
995            $roundDIV = undefined;
996            $maskDIV = undefined;

997            $tweenDIV = undefined;
998            $hiddenSelect = undefined;
999            itemWidth = undefined;
1000            itemHeight = undefined;
1001            listWidth = undefined;
1002            listHeight = undefined;
1003            btnWidth = undefined;
1004            btnHeight = undefined;
1005            isValue = undefined;
1006            isScroll = false;
1007            isDisabled = false;
1008            isEvent = false;
1009            opts = undefined;
1010            defaults = defaultOptions();
1011        };
1012
1013        //return target
1014        this.getTarget = function () {
1015            return $target;
1016        };
1017
1018        //return infomation
1019        this.getInfoSB = function () {
1020            return {
1021                index: selectIndex,
1022                value: selectValue,
1023                text: selectText
1024            };
1025        };
1026
1027        //set get index
1028        this.setIndexSB = function (_idx) {
1029            changeBtnState(true, 0);
1030            selectList($listA.eq(_idx));
1031            changeBtnState(false, 0);
1032        };
1033
1034        this.getIndexSB = function () {
1035            return selectIndex;
1036        };
1037
1038        //set get value
1039        this.setValueSB = function (_value) {
1040            var idx;
1041            $listA.each(function () {
1042                if ($(this).data('value') === _value) {
1043                    idx = $(this).closest('li').index();
1044                    return false;
1045                }
1046            });
1047
1048            this.setIndexSB(idx);
1049        };
1050
1051        this.getValueSB = function () {
1052            return selectValue;
1053        };
1054
1055        //set get text
1056        this.setTextSB = function (_value) {
1057            var idx;
1058            $listA.each(function () {
1059                if ($(this).text() === _value) {
1060                    idx = $(this).closest('li').index();
1061                    return false;
1062                }
1063            });
1064
1065            this.setIndexSB(idx);
1066        };
1067
1068        this.getTextSB = function () {
1069            return selectText;
1070        };
1071
1072        //set disabled
1073        this.disabledSB = function (_value) {
1074
1075            var target = $target.find('> a'); //btnA   // 190911 disabled시 target을 a 버튼으로 고정
1076            var txt = target.text();
1077            var cls = target.attr('class');
1078
1079            //first
1080            changeBtnState(false, 0);    //default close
1081
1082            if (_value) {
1083                (opts.disabledClass !== undefined) ? $target.addClass(opts.disabledClass).find('> a').attr('aria-disabled', 'true') : $target.css('opacity', 0.5); //240704 [MOZOP002-35243]
1084
1085                if ($hiddenSelect !== undefined) $hiddenSelect.prop('disabled', true);
1086
1087                var w = target.find('> span').width();
1088                if (!isDisabled) target.css('display', 'none').after('<span class="' + opts.btnClass + '"><span style="width:' + w + 'px">'+target.text()+'</span></span>');
1089
1090                if (isEvent) removeEvent();
1091            } else {
1092                (opts.disabledClass !== undefined) ? $target.removeClass(opts.disabledClass).find('> a').removeAttr('aria-disabled', 'true') : $target.css('opacity', 1); //240704 [MOZOP002-35243]
1093
1094                if ($hiddenSelect !== undefined) $hiddenSelect.removeAttr('disabled');
1095
1096                if (isDisabled) target.css('display', '').siblings('span').remove();
1097
1098                if (!isEvent) initEvent();
1099            }
1100
1101            isDisabled = _value;
1102        };
1103    };//end Obj
1104
1105    return wddoObj;
1106}(jQuery));
1107
1108//get instance
1109if (window.$.fn.getInstance === undefined) window.$.fn.getInstance = function () { //cmnJquery
1110    if(cmnJquery){
1111        var cmn_scope=cmnJquery(this).data('cmn_scope');
1112
1113        if(cmn_scope) {
1114            return cmn_scope;
1115        }
1116    }
1117
1118    return this.data('scope');
1119};
1120
1121if(!commonJs.event){
1122    commonJs.event = {
1123        SELECTBOX_INIT : 'selectBoxInit'
1124    };
1125}
1126
1127//multiple init
1128$.SelectBoxSet = function (_target, _options, _complete) { //cmnJquery
1129    var complete = _complete || function () {};
1130
1131    //document ready
1132    $(document).ready(function () {
1133        $(_target).each(function (idx) {
1134            var selectBox = new SelectBox($(this), _options);
1135            selectBox.initSB();
1136            //셀렉트 박스 로드후 호출
1137            if( commonJs ){
1138                commonJs.selectBox.trigger(commonJs.event.SELECTBOX_INIT);
1139            }
1140        });
1141        complete();
1142    });
1143};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.