위토즈 - 개발자프로그램판매공간

정보공유

[JQUERY] 비동기식으로 초성 버튼 클릭 보여주기


<ul class="btn-group-list">

    <li><input type="button" value="전체" onclick="filterByChosung('all');"></li>

    <li><input type="button" value="ㄱ" onclick="filterByChosung('ㄱ');"></li>

    <li><input type="button" value="ㄴ" onclick="filterByChosung('ㄴ');"></li>

    <li><input type="button" value="ㄷ" onclick="filterByChosung('ㄷ');"></li>

    <li><input type="button" value="ㄹ" onclick="filterByChosung('ㄹ');"></li>

    <li><input type="button" value="ㅁ" onclick="filterByChosung('ㅁ');"></li>

    <li><input type="button" value="ㅂ" onclick="filterByChosung('ㅂ');"></li>

    <li><input type="button" value="ㅅ" onclick="filterByChosung('ㅅ');"></li>

    <li><input type="button" value="ㅇ" onclick="filterByChosung('ㅇ');"></li>

    <li><input type="button" value="ㅈ" onclick="filterByChosung('ㅈ');"></li>

    <li><input type="button" value="ㅊ" onclick="filterByChosung('ㅊ');"></li>

    <li><input type="button" value="ㅋ" onclick="filterByChosung('ㅋ');"></li>

    <li><input type="button" value="ㅌ" onclick="filterByChosung('ㅌ');"></li>

    <li><input type="button" value="ㅍ" onclick="filterByChosung('ㅍ');"></li>

    <li><input type="button" value="ㅎ" onclick="filterByChosung('ㅎ');"></li>

</ul>

<div id="wrap-group-list">

    <span data-word="국민은행"><input type="checkbox" name="vg_ix[]" value="81" id="vg_ix_0"><label for="vg_ix_0"> 국민은행</label></span>

    <span data-word="하나은행"><input type="checkbox" name="vg_ix[]" value="82" id="vg_ix_1"><label for="vg_ix_1"> 하나은행</label></span>

    <span data-word="카카오뱅크"><input type="checkbox" name="vg_ix[]" value="84" id="vg_ix_2"><label for="vg_ix_2"> 카카오뱅크</label></span>

</div>



<script type="text/javascript">
<!--
    function filterByChosung(chosung) {
        $('#wrap-group-list span').hide(); // 전체 숨기기

        if (chosung === 'all') {
            $('#wrap-group-list span').show(); // 전체 보이기
            return;
        }

        $('#wrap-group-list span').filter(function () {
            const word = $(this).data('word');
            if (!word || word.length === 0) return false;

            const firstChar = word.charAt(0);
            return getChosung(firstChar) === chosung;
        }).show(); // 초성이 일치하는 것만 보이기
    }
    function getChosung(char) {
        const CHOSUNG_LIST = [
            "ㄱ", "ㄲ", "ㄴ", "ㄷ", "ㄸ", "ㄹ",
            "ㅁ", "ㅂ", "ㅃ", "ㅅ", "ㅆ", "ㅇ",
            "ㅈ", "ㅉ", "ㅊ", "ㅋ", "ㅌ", "ㅍ", "ㅎ"
        ];

        const code = char.charCodeAt(0);

        // 한글인지 확인 (가 ~ 힣: 44032 ~ 55203)
        if (code >= 44032 && code <= 55203) {
            const index = Math.floor((code - 44032) / 588);
            return CHOSUNG_LIST[index];
        }
        return ''; // 한글이 아니면 빈 문자열
    }
//-->
</script>
정보공유
Total 470건 1 페이지
번호 제목 글쓴이 날짜 조회
470 숫자를 입력하면 컴마단위로 찍히기. 숫자만 허용. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 12-17 2,337
469 짧은 접수번호 생성. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 12-10 2,606
468 아이코드 토큰방식 모듈 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 12-05 2,698
467 HTML 파일을 CSS가 적용된 PDF로 변환하여 서버에 저장하는 PHP 코드 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 11-06 3,449
466 phpMyAdmin 접속이 안될때, db 아이피 포트번호 다를때. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 09-18 3,002
465 실패되었습니다.[연동오류(PHP SOAP 모듈설치 필요)] 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 09-10 3,243
464 csv 파일 만들때 제일많이 하는 실수!! 필드에 , 가 있는경우 변환이 제대로 안된다. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 09-01 3,309
463 GROUP_CONCAT 길이 제한 때문에 결과값을 다 못가져오는 경우 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-26 3,239
462 회원아이디 자동 생성 함수 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-20 3,540
461 중앙 토스트 레이어 , 버튼을 클릭하면 화면 중앙에 3초간 보였다가 fadeout 되는 레이어창. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-19 3,625
460 관리자 권한이 super 아니고 관리권한설정을 부여받은 회원이 관리자 화면에 접속했을때 부여받은 메뉴로 바로 접속되도록 처리 (2) 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-15 3,698
459 관리자 권한이 super 아니고 관리권한설정을 부여받은 회원이 관리자 화면에 접속했을때 부여받은 메뉴로 바로 접속되도록 처리 (1) 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-15 3,628
458 SQL 주입 방지 Prepared Statement 의 생활화 mysqli PDO 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-15 3,236
457 크로스 사이트 스크립팅(XSS) 테스트 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-12 3,674
456 2일전부터 오늘까지의 데이터 정보 가져오기. 위토즈쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 08-05 3,309