> 웹 프론트엔드 > CSS 튜토리얼 > ASP.NET MVC 탐색 링크에 '활성' 클래스를 효율적으로 추가하는 방법은 무엇입니까?

ASP.NET MVC 탐색 링크에 '활성' 클래스를 효율적으로 추가하는 방법은 무엇입니까?

Patricia Arquette
풀어 주다: 2024-12-31 21:49:11
원래의
182명이 탐색했습니다.

How to Efficiently Add the

Html.ActionLink에 활성 클래스 추가

ASP.NET MVC에서는 탐색 요소에 "active" 클래스를 설정하는 것이 일반적입니다. 현재 활성 페이지를 나타냅니다. 그러나 클래스를 태그는 원하는 접근 방식이 아닐 수 있습니다.

부트스트랩 고려 사항

부트스트랩의 경우 활성 클래스는 일반적으로 <li> 꼬리표. 따라서 다음과 같이 코드를 수정해야 합니다.

<ul>
로그인 후 복사
로그인 후 복사

동적 클래스 할당

현재 페이지를 기반으로 활성 클래스 할당 프로세스를 자동화하려면, 다음 접근 방식을 사용할 수 있습니다.

<ul>
로그인 후 복사
로그인 후 복사

ViewContext.RouteData.Values ​​속성을 사용하면 현재 동작과 컨트롤러를 자동으로 결정할 수 있습니다. 삼항 연산자를 사용하면 수행 중인 작업에 따라 활성 클래스를 조건부로 추가할 수 있습니다.

HtmlHelper Extension

보다 깔끔하고 우아한 솔루션을 위해 HtmlHelper 확장 방법:

public static string IsSelected(this HtmlHelper html, string controllers = "", string actions = "", string cssClass = "selected")
{
  // Get the current action and controller
  string currentAction = html.ViewContext.RouteData.Values["action"].ToString();
  string currentController = html.ViewContext.RouteData.Values["controller"].ToString();

  // Create arrays of accepted actions and controllers
  string[] acceptedActions = actions.Trim().Split(',').Distinct().ToArray();
  string[] acceptedControllers = controllers.Trim().Split(',').Distinct().ToArray();

  // Check if the current action and controller match any of the accepted values
  return acceptedActions.Contains(currentAction) &amp;&amp; acceptedControllers.Contains(currentController) ?
    cssClass : string.Empty;
}
로그인 후 복사

이 확장 방법을 사용하면 다음을 사용하여 활성 클래스를 쉽게 할당할 수 있습니다. 다음 구문:

<li>
로그인 후 복사

위 내용은 ASP.NET MVC 탐색 링크에 '활성' 클래스를 효율적으로 추가하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿