按下按钮并成功重定向到另一个页面后，如何禁用导航栏链接？

Posted 2023-04-13

【中文标题】按下按钮并成功重定向到另一个页面后，如何禁用导航栏链接？

【英文标题】：How can I disable a navbar link after I push a button and successfully redirect to another page?

【发布时间】：2019-12-11 22:22:27

【问题描述】：

我正在处理一个项目，如果发布请求成功，我需要在按下将我重定向到另一个页面的按钮后禁用导航栏链接。

如何访问导航栏链接，是否需要使用 css 选择器，我打算使用 jquery 禁用它，但我不知道如何从另一个文件中选择它，因为我的脚本在我的 Index.html 中，我必须有权访问 _Navbar.html

//这是我的 _Navbar.html 页面。我想在按下按钮后禁用联系人页面。

<nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">                   
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>                   
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a asp-page="/Index">Home</a></li>
                    <li><a asp-page="/About">About</a></li>
                    <li><a asp-page="/Contact">Contact</a></li>
                </ul>
            </div>
        </div>
</nav>

//我尝试从 Index.html 中对选择器进行 css 化，但它不起作用。

【参考方案1】：

_Navbar.html 内容是 DOM 的一部分，因此无论从哪个文件调用它，您都应该能够从脚本访问它。

链接项没有唯一 ID - 理论上，如果“联系”始终处于一致位置，您可以查找“导航栏导航”的第 n 个子项，但这是一种反模式如果它移动了，那将来会让你头疼的。

简单的解决方案，给每个链接项一个ID，你可以根据需要选择和隐藏。