테스트 사이트 - 개발 중인 베타 버전입니다

메뉴에서 선택한 값 가져오기.. 채택완료

심심한나쵸 2년 전 조회 2,126

메뉴를 펼쳤다가 선택된 값의 텍스트와 class명을 일일히 넣어주고 있는데요..(초보라서 좋은 코드가 아니란건 알고 있습니다 ㅠㅠ)

다른 페이지에서 메뉴를 클릭하면 다시 메인으로 넘어와서 메인의 #id값을 부여하여 해당 영역으로 이동하게끔 해두었거든요.. 그때도 메뉴가 바뀌어야 하는데.. 

서브페이지에서도 메뉴를 클릭하여 링크로 이동되면 이동된 페이지에서 메뉴 값이 바뀌게 하고 싶습니다.. 어떻게 하면 좋을까요?

 

코드는 이렇습니다..

 

</p>

<p><div id="gnb" class="gnb gnbM"></p>

<p>                <button class="navOpnBtn" title="네비게이션 열기"></p>

<p>                    <strong class="navNm"></p>

<p>                        <span></p>

<p>                            안내</p>

<p>                        </span></p>

<p>                        <i></i></p>

<p>                    </strong></p>

<p>                </button></p>

<p>                <div></p>

<p>                    <ul></p>

<p>                        <li class="menu1"></p>

<p>                            <a href="index.asp#sct01" class="menu01"></p>

<p>                                <s class="icon icon1"></s></p>

<p>                                <span>안내</span></p>

<p>                            </a></p>

<p>                        </li></p>

<p>                        <li class="menu2"></p>

<p>                            <a href="index.asp#sct03" class="menu02"></p>

<p>                                <s class="icon icon2"></s></p>

<p>                                <span>내역</span></p>

<p>                            </a></p>

<p>                        </li></p>

<p>                        <li class="menu3"></p>

<p>                            <a href="index.asp#sct05" class="menu03"></p>

<p>                                <s class="icon icon3"></s></p>

<p>                                <span>신청</span></p>

<p>                            </a></p>

<p>                        </li></p>

<p>                    </ul></p>

<p>                </div></p>

<p>            </div></p>

<p>

 

</p>

<p>$(".gnbM > div > ul > li.menu1").click(function(){</p>

<p>  $(".navNm > span").text("안내");</p>

<p>  $(".navNm > span").attr("class", "list1");</p>

<p>});</p>

<p>$(".gnbM > div > ul > li.menu2").click(function(){</p>

<p>  $(".navNm > span").text("내역");</p>

<p>  $(".navNm > span").attr("class", "list2");</p>

<p>});</p>

<p>$(".gnbM > div > ul > li.menu3").click(function(){</p>

<p>  $(".navNm > span").text("신청");</p>

<p>  $(".navNm > span").attr("class", "list3");</p>

<p>});</p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
$(".gnbM > div > ul > li.menu").click(function(){
  var title= $( this).find( 'span').text("안내");
  $(".navNm > span").text( title);
  var class= $( this).attr('class').replace( 'menu0','list');
  $(".navNm > span").attr("class", class);
});
로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

클릭해서 정보를 넘기는건 변수를 페이지마다 매번 넘겨야하는데 한계가 있습니다.

차라리 메인 및 서브일경우 각 페이지별로 현재위치 변수가 그누보드에 있는데 그 변수를 활용하시는건 어떤가요?

 

과거 제 답변내용이 있으니 참조하셔서 페이지별로 변수할당하셔도 됩니다.

https://sir.kr/qa/453203

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인