게시판 목록화면에서 중복되는 클래스, 아이디

게시판 목록화면에서 중복되는 클래스, 아이디

QA

게시판 목록화면에서 중복되는 클래스, 아이디

답변 1

본문


<style>
    ul {list-style:none;padding:0px;margin:0px;}   
    .tab li {border:1px solid red;width:100px;height:100px;}
    .tab li.on {background:blue}
 
    .conbox li{display:none;}
    .conbox li.on {display:block}
 
</style>
<div class="tab">
    <ul>
        <li data-id="con1" class="on"></li>
        <li data-id="con2"></li>
    </ul>    
</div>
 
<div class="conbox">
    <ul>
        <li id="con1" class="on">first box</li>
        <li id="con2">seconds box</li>
    </ul>
</div>

 
<script>
    $(function(){
       
        $(".tab ul li").click(function(){          
            $(".tab ul li").removeClass('on');
            $(".conBox li").removeClass('on');
            $(this).addClass('on');
            $("#"+$(this).data('id')).addClass('on');
        });
    });
</script>

 

 

위 코드는 탭메뉴를 실행하는 간단한 jquery 입니다. 일반 페이지에서는 정상적으로 동작을 합니다.

이걸 적용해서 그누보드 게시판 목록화면에서 각 목록마다 탭메뉴를 구현하려고 합니다.

 

위 부분이 계속해서 반복이 되다보니 id값이 겹치는 문제가 있어서

아이디 값 앞에 강제로 wr_id를  오게 해서 어떻게 해결을 하긴 했습니다.

 

근데 이게 jquery 에서 this를 사용하면 아이디가 중복되더라도 지금 클릭한 것에 대해서만 처리하는게 있는것 같은데 암만 해봐도 되질 않네요 ㅠㅠ

 

도움부탁드립니다.

이 질문에 댓글 쓰기 :

답변 1

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 2,422
© SIRSOFT
현재 페이지 제일 처음으로