如何显示加载图标或禁用按钮unitl登录asp.net核心剃刀

<span id="loading-icon" class="fa fa-spinner fa-spin" style="display:none;"></span>

<button id="login-button" type="submit">登录</button>

<script>
    // 获取登录按钮元素和加载图标元素
    var loginButton = document.getElementById("login-button");
    var loadingIcon = document.getElementById("loading-icon");

    // 监听登录按钮的点击事件
    loginButton.addEventListener("click", function() {
        // 禁用登录按钮
        loginButton.disabled = true;
        // 显示加载图标
        loadingIcon.style.display = "inline-block";

        // 这里可以添加登录的相关代码
        // ...

        // 模拟登录完成后的延迟操作
        setTimeout(function() {
            // 启用登录按钮
            loginButton.disabled = false;
            // 隐藏加载图标
            loadingIcon.style.display = "none";
        }, 2000); // 延迟2秒，可以根据实际情况调整
    });
</script>