如何使用jQuery验证用户正在使用HTML表单上传文件

How to validate with jQuery that the user is uploading a file using an HTML form?

本文关键字：HTML 表单 文件 jQuery 何使用 验证 用户      更新时间：2023-09-26

我想验证用户不会让文件输入字段为空。

我使用jQuery插件验证。在那个链接中有一个插件应该如何工作的演示。

我已经将文件添加到页脚(并检查它们实际上在那里):

<!-- jQuery y Bootstrap minificados -->
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<!-- validacion de los campos de los formularios -->
<script src="/js/validate/jquery.validate.min.js"></script>
<script src="/js/validate/additional-methods.min.js"></script>
<!-- My file -->
<script src="/js/formularios.js"></script>

在我的formularios.js文件中，我添加了这个:

//validación de la data en el formulario de carga de documentación
$().ready(function {
  $("#cargarDoc").validate({
    rules: {
              dni: {
                required: true,
                extension: "gif|jpeg|jpg|png"
              },
    messages:{
              dni: {
                required: "No puedes dejar este campo en blanco",
                extension: "Solamente puedes cargar archivos del tipo: gif, jpeg, jpg o png"
              }
    }
    }
  })
})
这是我的HTML表单: 
<form id="cargarDoc" method="POST" action ="cargarDoc.php" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="1000000">
<div class="form-group">
<label for="dni">Cargá acá tu DNI</label>
<input type="file" id="dni" name="dni">
</div>          
<button type="submit">Cargar Documentación</button>
</form>

现在，当我提交表单时，即使是空的，它也允许我。我做错了什么?

这个问题是一个语法错误，可能是由于代码缩进不当引起的。

/validación de la data en el formulario de carga de documentación
$().ready(function {
  $("#cargarDoc").validate({
        rules: {
            dni: {
                required: true,
                extension: "gif|jpeg|jpg|png"
            }
        },
        messages:{
            dni: {
                required: "No puedes dejar este campo en blanco",
                extension: "Solamente puedes cargar archivos del tipo: gif, jpeg, jpg o png"
            }
        }
    });
});

将上面的代码与您的代码进行比较，看看细微的差异。

Validate使用对象来定义它的行为。

"rules"， "message"answers"dni"是对象。
对象定义在花括号之间:{和}，由key和value对组成。

一个对象可以包含其他对象…
这就是"rules"answers"message"的情况，它们都包含自己的"dni"对象。

对象内的逗号,用作分隔符。

在许多编码语言中，分号;用于分隔语句。

相关文章：