HTML 输入属性"required"仅适用于一个按钮

Question

我有一个文件输入，它是用提交按钮提交的。但是还有一个相同形式的删除按钮。所以我的问题是，当我按下删除按钮时，它会说"请选择一个文件"，因为"必需"属性在文件输入中。我希望此消息仅在您按下上传按钮时显示(当然，仅当输入为空时(。

这是我的代码：

<form>
<input name="file" id="file" type="file" required>
<input type="submit" name="sub_image" value="Upload">
<input type="submit" name="del_image" value="Delete">
</form>

Answer 1

您可以使用 formnovalidate 属性跳过特定提交按钮的验证：

<form>
<input name="file" id="file" type="file" required>
<input type="submit" name="sub_image" value="Upload">
<input type="submit" name="del_image" value="Delete" formnovalidate >
</form>

Answer 2

(function ($) {
	
    $('#my-form').validate({
        rules: {},
        messages: {},
        submitHandler: function () {
            return false
        }
    });
    $('#del_image').click(function(){
	
		$("#file").val("");
	});
    
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
<form id="my-form">
<input name="file" id="file" type="file" required>
<input type="submit" name="sub_image" value="Upload">
<button id="del_image">Delete</button>
</form>