如何根据页面的 URL 更改元素的类答案

【问题标题】：How to change the class of an element based on the URL of the page如何根据页面的 URL 更改元素的类
【发布时间】：2017-09-13 04:43:13
【问题描述】：

我的网页中有一个导航侧边栏。我在这个侧边栏中有几个链接，根据网页只有一个是活动的。例如。如果 URL 是 /Instructional_Activities，我想将链接的教学活动类更改为活动。我的 html 代码如下所示：

<ul class="nav">
            <li class="active">
                <a href="#" onclick="document.getElementById('dash-form').submit()">
                    <i class="pe-7s-graph"></i>
                    <p>Dashboard</p>
                    <form id="dash-form" action="/dashBoard" method="POST">
                        {{csrf_field()}}
                        <input type="hidden" value="test" name="generic">
                    </form>
                </a>
            </li>



            <li>

                <a href="#" onclick="document.getElementById('form-id').submit();">
                    <i class="pe-7s-note2"></i>
                    <p class='simple-text'>Instructional Activities Report</p>
                    <form id="form-id" method="POST" action="/Instructional_Activities">
                        {{csrf_field()}}
                        <input type="hidden" value="test" name="generic">
                    </form>

                </a>
            </li>

我想根据页面的 URL 为“活动”类建立适当的链接。任何帮助表示赞赏。

【问题讨论】：

标签： javascript html laravel

【解决方案1】：

您可以使用is() 方法。例如：

<p class="{{ request()->is('Instructional_Activities') ? 'active' : 'simple-text' }}">

【讨论】：

我通常从处理这些路由的控制器/函数返回一个$page 变量，然后进行比较：<p class="{{ $page == "thisPage" ? "active" : "" }}">...</p>
非常感谢！那么这样的事情会起作用吗？
假设我不想提供替代课程？

@Muhammad 如果您不想添加任何课程，请确保您可以使用''。

是的，它工作得很好，再次感谢这个解决方案！