如何防止JavaScript form.submit（）忽略必填字段

我有一个HTML表单，其中包含一些文本字段和图像的文件输入。它有文本所需的字段，还对使用JavaScript（jQuery）选择的图像进行客户端验证

表格如下：

<form name="addbookform" id="addbookform" action="processaddbook.php" method="POST">
<p />
<input name="name" id="name" type="text" placeholder="Name" required />
<p />
<textarea name="description" id="description" cols=30 rows=4 placeholder="Enter a short description">
</textarea>
<p />
<input name="image" id="image" type="file" accept="image/png, image/jpeg" />
<p />
<input type="button" id="finishbutton" value="Submit" />
</form>

现在图像检查按预期工作（报告错误或图像有效），但是，表单上的

名称
输入中有一个必填字段。当图像检查通过（或没有图像）时，将调用submit函数，但HTML似乎跳过了所需的字段验证

有什么方法可以防止这种情况发生吗？
我认为与其强制表单提交，不如用另一种方法：如果出现问题，请防止表单提交。

将“提交”按钮类型更改为“提交”。这将在单击时呈现带有表单提交操作的按钮
将事件更改为处理表单提交，而不是单击按钮
将标志值设置为true。如果在验证结束时，标志为false，则阻止提交
检查你的图像。如果出现任何问题，请更改标志
检查您的输入。如果出现任何问题，请更改标志
（注意）到目前为止，表单提交是无法停止的。只更改标志
在验证结束时。检查你的旗帜。如果为false，则阻止提交。如果是真的，什么也不做
在表单提交中，如果
返回false
在提交事件的任何时候，提交都将被取消。
我将使用正常的
type=submit
按钮，然后使用
$（“#addbookform”）。在（“submit”，…）
上执行任何附加验证，防止在图像验证失败时提交，如果要避免对已标记为“required”属性的字段进行双重检查，可以请求表单additemform.checkValidity（），该表单仅在所有必需输入都具有某些值时才返回true。但确切地说，捕捉表单提交事件比捕捉按钮点击更容易控制，以防止无效提交。
$(document).ready(function() {
    $('#finishbutton').click( function() {
        var fileInput = document.getElementById("bookimage");
        if (fileInput.value == "") {
            // We can just submit the form without an image.
            addbookform.submit();
        } else {
            // Check for image size and other properties...
            if (success == true) {
                addbookform.submit();
            }
        }
    });

});