我的問題是我想在登錄后在母版頁布局中啟用 html 元素，但我不能

Question

這就是我的全部代碼。 我的問題是我想在登錄后在母版頁布局中啟用 html 元素。 但我不能。

<li>
    <a href="@Href("~/Admin/")" id="btn_admin">Admin</a>
</li>

我在這里給身份證。 我跑步時正在加載。 在腳本部分，我寫了這個

document.getElementById('btn_admin').style.display = "none";   

並在簽名按鈕內，單擊它后，我想向管理員顯示以下代碼在母版頁的同一腳本中。

 $(document).ready(function () {
            $("#btn_submit").click(function () {
                var user = {};
                user.Email = $('#username').val();
                user.Password = $('#password').val();
                $.ajax({
                    url: 'https://localhost:44300/api/auth/Login',
                    type: 'POST',
                    data: user,
                    success: function (response) {
                        console.log(response);
                        if (response.Succeeded) {
                            $.cookie('UserId', response.UserId, { expires: 7, path: '/' });
                            $.cookie('Token', response.Token, { expires: 7, path: '/' });
                            //$("#btnLogin").fadeOut();
                            document.getElementById('btnLogin').style.display = "none";
                            document.getElementById('btn_admin').style.display = "block";
                            window.location.href = '/Home';

                        }
                        else {
                            alert(response.Message);
                        }
                        // setCookie("UserId", response.UserId);
                        //setCookie("Token", response.Token);

                    },
                    error: function () {
                        console.log('Error in Operation');
                    }
                });
            });

Answer 1

點擊它后，我想顯示管理員

你在這里成功地做到了：

document.getElementById('btn_admin').style.display = "block";

但是，接下來要做的就是重定向用戶：

window.location.href = '/Home';

因此，當用戶導航到另一個頁面時，對頁面的 state 所做的任何更改當然會丟失。 畢竟，當用戶不再在該頁面上時，如何期望鏈接仍然可見？

從概念上退一步，聽起來你想要的可以描述為：

在主布局上，如果用戶當前已登錄，則顯示“管理員”鏈接。

那是服務器端邏輯，而不是客戶端邏輯。 大概（希望）在https://localhost:44300/api/auth/Login的服務器端邏輯的某個地方設置了一些跟蹤用戶的方式。 ASP.NET MVC 具有內置的身份驗證和授權 function，所以我假設您正在使用它或一個合理的替代方案。 在這種情況下，在布局視圖中，您可能會執行以下操作：

@if (Request.IsAuthenticated) {
    <li>
        <a href="@Href("~/Admin/")" id="btn_admin">Admin</a>
    </li>
}

如果您使用角色，您甚至可以執行以下操作：

@if (Request.IsAuthenticated) {
    @if (User.IsInRole("Admin")) {
        <li>
            <a href="@Href("~/Admin/")" id="btn_admin">Admin</a>
        </li>
    }
}

這樣，您甚至不必費心隱藏鏈接客戶端：

document.getElementById('btn_admin').style.display = "none";

（順便說一句，這不是一種安全措施。我假設你不認為它是，但為了完整起見，任何未來的讀者都應該絕對意識到隱藏鏈接不會阻止用戶訪問頁面.)

由於用戶正在從一個頁面導航到另一個頁面，因此無論如何都會在每個頁面加載時重新調用服務器端代碼。 所以在這種情況下，這確實是放置這些條件的理想位置，這些條件在顯示頁面內容之前檢查授權。