> 웹 프론트엔드 > CSS 튜토리얼 > 부트스트랩 탐색을 위해 ASP.NET MVC의 Html.ActionLink에 '활성' 클래스를 추가하는 방법은 무엇입니까?

부트스트랩 탐색을 위해 ASP.NET MVC의 Html.ActionLink에 '활성' 클래스를 추가하는 방법은 무엇입니까?

Mary-Kate Olsen
풀어 주다: 2024-12-19 01:00:10
원래의
531명이 탐색했습니다.

How to Add the

ASP.NET MVC의 Html.ActionLink에 "active" 클래스 추가

Context

Bootstrap navbar에 "active" 클래스 추가 사용자가 현재 보고 있는 페이지에 대한 시각적 피드백을 제공하기 위한 필수 단계입니다. Html.ActionLink를 사용하여 탐색 링크를 생성할 때 링크 자체에 클래스를 할당할 것으로 예상할 수 있습니다. 그러나 적절한 기능을 위해서는 클래스를

  • element.

    해결책

    이 요구 사항을 해결하려면 다음과 같이 코드를 수정하세요.

    <ul class="nav navbar-nav">
        <li class="active">@Html.ActionLink("Home", "Index", "Home")</li>
        <li>@Html.ActionLink("About", "About", "Home")</li>
        <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
    </ul>
    로그인 후 복사

    "active" 클래스를

  • 요소를 사용하면 Bootstrap이 활성 페이지를 나타내기 위해 링크 스타일을 올바르게 지정합니다.

    고급 고려 사항

    여러 작업이나 컨트롤러가 선택한 동작을 트리거할 수 있는 시나리오의 경우 HtmlHelper 확장 메서드 사용을 고려하세요.

    public static string IsSelected(this IHtmlHelper htmlHelper, string controllers, string actions, string cssClass = "selected")
    {
        string currentAction = htmlHelper.ViewContext.RouteData.Values["action"] as string;
        string currentController = htmlHelper.ViewContext.RouteData.Values["controller"] as string;
    
        IEnumerable<string> acceptedActions = (actions ?? currentAction).Split(',');
        IEnumerable<string> acceptedControllers = (controllers ?? currentController).Split(',');
    
        return acceptedActions.Contains(currentAction) && acceptedControllers.Contains(currentController) ?
            cssClass : String.Empty;
    }
    로그인 후 복사

    이 확장을 사용하면 이제 다음 구문을 사용할 수 있습니다.

    <li class="@Html.IsSelected(actions: "Home", controllers: "Default")">
        <a href="@Url.Action("Home", "Default")">Home</a>
    </li>
    로그인 후 복사

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

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