使用按钮 class 制作标签以禁用

Question

我有一个如下的标签

<a class="button button-3d button-rounded btn-success" asp-page-handler="Download">
   <i class="fa fa-download"></i>
</a>

有处理程序：

public async Task<FileResult> OnGetDownloadAsync()
{
    return File(await export.ExportAsync(), MediaTypeNames.Application.Octet, fileName + ".xlsx");
}

export.ExportAsync 调用有时会很长。所以我想在系统工作时禁用按钮。我怎样才能做到这一点？有人可以帮助我吗？

Answer 1

<a>无法获取数据传输状态。虽然点击后是禁用的，但是数据请求完成后标签的状态是无法修改的。我建议你使用 ajax 因为它可以跟踪请求的状态。

<button onclick="tap()" id="mybtn" class="btn-primary ">click</button>
@section Scripts{ 
<script>
function tap() {
    $('#mybtn').attr("class", "disabled");

    var url = '/?handler=Download';
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = "blob"; //  return type:blob
    xhr.onload = function (data, textStatus, request) {// finish request
        if (this.status === 200) {
            $('#mybtn').attr("class", "btn-primary");

            var blob = this.response;// get the return value
            var a = document.createElement('a');
            var fileName = xhr.getResponseHeader('Content-Disposition').split(";")[1].split("=")[1];
            a.download = fileName

            a.href = window.URL.createObjectURL(blob);
            a.click();
        }
    };

    // send request
     xhr.send();
}

</script>
}

使用按钮 class 制作标签以禁用

Make a tag with button class to disabled

html

c#

tags

asp.net-core