在第二页上添加"提交"按钮不起作用

Question

我正在做一个演示项目，该项目上传了一张照片并返回了人名。所以基本上我使用 HTML，它由 2 页组成，第一页 - 供用户上传照片并提交，而第二页 - 将显示照片中识别的名称。我有一个 Web 服务，我需要启用它才能进行人脸识别。第一页有一个提交按钮，用于上传照片，但我希望提交按钮也位于第二页上，以便用户可以提交另一张照片，而无需返回第一页。我将第一页中的HTML代码复制到第二页，

<form>
<div class="upload-btn-wrapper">
<button class="btn">Submit</button>
</div>
</form>

提交按钮的结构在那里。但它不起作用，虽然它适用于第一页，但它在第二页上不起作用。可能是什么问题？如果您需要更多澄清，请告诉我，我很乐意这样做

第一页的代码 第 1 页

第二页的代码 第 2 页

两个页面的代码几乎相同。

Answer 1

您需要在提交时添加条件，并在要提交的位置添加操作属性。

<form action="upload.php">
<input type="file" name="file" id="uploadFile" />
<div class="upload-btn-wrapper">
<button type="submit" class="btn">Submit</button>
</div>
</form>

为了验证，你需要添加一些jQuery代码

$(document).on("click", ":submit", function (e) {
if( document.getElementById("uploadFile").files.length == 0 ){
alert("no files selected"); // or you can use other approach
e.preventDefault();
}
}