JavaScript) 동일한 클래스 중 하나 선택하여 작업

misonaru·2023년 6월 14일

메뉴를 클릭할 때마다 해당 메뉴명을 가져와야 하여 소스를 살펴보았다.

<div id="areaLeft">
    <h1>
        <a href="${pageContext.request.contextPath}/bond/aa/tbbondaa01lv.do">데이터결합 시스템</a>
    </h1>
    <ul class="aside-nav-list">
       	<c:forEach items="${sideList}" var="sideMenu" varStatus="status">
       		<c:choose>
	    		<c:when test="${sideMenu.menu_type == '1' }">
					<li class="collapse_link"><a class="sideTabs ${sideMenu.menu_id }" href="#none">${sideMenu.menu_nm }</a>
						<ul class="aside-nav-list2">
							<c:forEach items="${sideList}" var="sideSubMenu" varStatus="status">
								<c:choose>
									<c:when test='${sideSubMenu.menu_url != null && sideSubMenu.menu_url != "" && sideSubMenu.menu_url != "http://" &&
													sideSubMenu.menu_type == "2" && sideMenu.menu_id == sideSubMenu.spst_menu_id}'>
						                <li>
								        	<a class="sideSubTabs ${sideSubMenu.menu_id }" href="${pageContext.request.contextPath}${sideSubMenu.menu_url}" >
								        		<span class="ment">- ${sideSubMenu.menu_nm }</span>
								        	</a>
								        </li>
						            </c:when>
						            <c:when test='${(sideSubMenu.menu_url == null || sideSubMenu.menu_url == "" || sideSubMenu.menu_url != "http://") &&
													sideSubMenu.menu_type == "2" && sideMenu.menu_id == sideSubMenu.spst_menu_id}'>
						            	<li class="collapse_link2"><a class="sideSubTabs ${sideSubMenu.menu_id }" href="#none">- ${sideSubMenu.menu_nm }</a>
						                	<ul class="aside-nav-list3">
							                	<c:forEach items="${sideList}" var="sideThreeList" varStatus="status">
							    					<c:if test='${sideThreeList.rltv_menu_id == sideSubMenu.menu_id }'>
								    					<li>
								    						<a class="sideThreeTabs ${sideThreeList.menu_id }" href="${pageContext.request.contextPath}${sideThreeList.menu_url}">
								    						${sideThreeList.menu_nm }</a>
								    					</li>
							    					</c:if>
							    				</c:forEach>
							    			</ul>
						    			</li>
						            </c:when>
					            </c:choose>
					        </c:forEach>
				        </ul>
					</li>
				</c:when>
			</c:choose>
		</c:forEach>
    </ul>
</div>

필요한 녀석은 ment 클래스.
미련하게 '헤헤 ment의 text값만 가져오면 되는 거 아니냐고 헤헿'이라고 했더니
온~갖 메뉴명에 시달렸다. 모든 메뉴명이 다 출력되는 거 아닌가;;;


따라서 지금 클릭한 녀석에 특정 클래스를 잠시 부여하고, 그 클래스에 대한 값만 가져오는 것으로 생각하였다.

$(".ment").click(function(){
		$(".ment").removeClass("tmp_active");
		$(this).addClass("tmp_active");
		
		var menu_nm = $(".tmp_active").text();
		menu_nm = menu_nm.substring(2);
		alert(menu_nm);
	})
profile
미소와 나루 집사

0개의 댓글