Javascript 上载文件时显示加载图标

我试图在用户上载文件时显示某种类型的加载图标。我使用的是基本类型的文件上传

以下是我正在使用的控制代码：

视图：

我的控制器中有一个方法，它接受文件并保存到数据库中

您可以看到，在我的代码中，我有onchange=“form.submit”，它在用户选择文件后提交表单。我更喜欢这种方式，而不是用户在选择文件提交表单后必须单击另一个按钮

我的问题是，当用户选择一个较大的文件时，页面在加载和上载文件时会停留一段时间，然后在20-30秒后提交表单

我需要添加一些代码，在加载文件和重新提交表单时显示某种类型的加载/旋转图标。

我相信大多数加载发生在文件上传时，而不是表单提交期间

---

非常感谢您的帮助。

您可以使用许多选项和库。 如果您使用的是JQuery，那么您可以使用类似的东西来很好地工作。那里也有很好的文档

您只需将

onchange

调用更改为

onchange="submitForm();"

并具有如下javascript函数，例如：

function submitForm(){
    $("#spinner").LoadingOverlay("show");
    $("#form").submit();
}

---

有很多不同的微调器，你不必使用JQuery。但是想法是一样的。

如果您使用引导，我发现您可以放置文本和微调器。看看它

<button class="btn btn-primary">
  <span class="spinner-border spinner-border-sm"></span>
  Loading..
</button>

加载。。

应用程序处理表单数据时，可以将布尔值设置为

isLoading=true

，然后将其设置为

false

。

<button class="btn btn-primary">
  <span class="spinner-border spinner-border-sm"></span>
  Loading..
</button>