如何在html中的上传按钮旁边打印输入文件的名称

Question

我试图在上传按钮旁边打印文件的名称，但由于某种原因，它不起作用。目前，上传按钮有效，但我希望在它旁边打印文件的名称。

这是我的 html 的样子

这是上传标签类之一的 css 部分

.upload-label{

    display: inline-block;

    padding: 12px 30px;

    background: #39D2B4;

    color: #fff;

    font-size: 1em;

    transition: all .4s;

    cursor: pointer;

}

.upload-label:hover{

    background: #34495E;

    color: #39D2B4;

}

HTML

<form id="upload-file" method="post" enctype="multipart/form-data">

    <label for="imageUpload" class="upload-label">

        Choose...

    </label>

    <input type="file" name="file" id="imageUpload" accept=".png, .jpg, .jpeg">

</form>