Rumah > hujung hadapan web > tutorial css > Bagaimana untuk Menambah Kelas 'aktif' ke Html.ActionLink dalam ASP.NET MVC untuk Navigasi Bootstrap?

Bagaimana untuk Menambah Kelas 'aktif' ke Html.ActionLink dalam ASP.NET MVC untuk Navigasi Bootstrap?

Mary-Kate Olsen
Lepaskan: 2024-12-19 01:00:10
asal
529 orang telah melayarinya

How to Add the

Menambahkan Kelas "aktif" pada Html.ActionLink dalam ASP.NET MVC

Konteks

Menambah kelas "aktif" pada navbar Bootstrap ialah langkah penting untuk memberikan maklum balas visual kepada pengguna pada halaman semasa yang mereka buka. Apabila menggunakan Html.ActionLink untuk menjana pautan navigasi, anda mungkin mengharapkan untuk menetapkan kelas kepada pautan itu sendiri. Walau bagaimanapun, untuk kefungsian yang betul, kelas mesti digunakan pada

  • elemen.

    Penyelesaian

    Untuk menangani keperluan ini, ubah suai kod anda seperti berikut:

    <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>
    Salin selepas log masuk

    Dengan menggunakan kelas "aktif" pada

  • elemen, Bootstrap akan menggayakan pautan dengan betul untuk menunjukkan halaman aktif.

    Pertimbangan Lanjutan

    Untuk senario di mana berbilang tindakan atau pengawal boleh mencetuskan gelagat yang dipilih, pertimbangkan untuk menggunakan kaedah sambungan 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;
    }
    Salin selepas log masuk

    Dengan sambungan ini, anda kini boleh menggunakan yang berikut sintaks:

    <li class="@Html.IsSelected(actions: "Home", controllers: "Default")">
        <a href="@Url.Action("Home", "Default")">Home</a>
    </li>
    Salin selepas log masuk

    Atas ialah kandungan terperinci Bagaimana untuk Menambah Kelas 'aktif' ke Html.ActionLink dalam ASP.NET MVC untuk Navigasi Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

  • sumber:php.cn
    Kenyataan Laman Web ini
    Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
    Artikel terbaru oleh pengarang
    Tutorial Popular
    Lagi>
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan