jQuery验证插件的文件字段没有按预期工作

我试图通过使用accept方法使用jQuery验证插件来限制用户可以上传的文件的类型。jQuery验证插件的文件字段没有按预期工作

它在插件示例页面中工作，但不适合我。

检查此页面：http://jquery.bassistance.de/validate/demo/file_input.html当它说接受：“text/plain”选择文件窗口只显示文件夹中的文本文件。这是一件好事。

当我这样做（有点不同）我失败了。我可以看到文件夹中的所有文件。我该如何做到这一点？

<!DOCTYPE html> 
<html lang="en" dir="ltr" class="client-js"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>I'm stuck</title> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script> 
<script src="http://jquery.bassistance.de/validate/additional-methods.js"></script> 
</head> 
<body> 

<form id="imageForm" enctype="multipart/form-data" method="post"> 
    <input type="file" name="itemImage" class="itemImage"> 
    <label for="itemImage" generated="true" class="error itemImage"></label> 
    <input type="submit" value="Upload Image" class="imageForm" id="submitbutton"> 
</form> 
</body> 
</html> 

$("#imageForm").validate({ 
    rules: { 
     itemImage: { 
      required: true, 
       accept: "text/plain" 
     }, 
    }, 
    messages: { 
     itemImage: { 
      required: "Please select a text file", 
      accept: "Only text files" 
     }, 
    }, 
    submitHandler: function() {

来源

2014-03-28 Norman

使用#imageForm代替#image，并附在script tag喜欢你code，

<script> 
    $(function(){ 
     $("#imageForm").validate({ 
      rules: { 
       itemImage: { 
        required: true, 
        accept: "text/plain" 
       }, 
      }, 
      messages: { 
       itemImage: { 
        required: "Please select a text file", 
        accept: "Only text files" 
       }, 
      }, 
     }); 
    }); 
</script>

Live Demo

来源

2014-03-28 12:45:21

不工作。它仍然是一样的。 – Norman

在他的演示中，当他指定“text/plain”时，你只能在选择文件窗口中看到.txt文件。这就是我想在这里实现的，但它不会工作。在你的演示中它是一样的。用户可以看到所有的文件。 – Norman

@Norman，你的_expectations_坏了，不是演示。如果选择了错误的文件类型，验证插件将仅向您提供验证错误消息，即所有......它无法过滤文件浏览器窗口中的文件。 – Sparky

报价OP：

“我试图通过使用接受方法来限制用户可以上传的文件的类型，使用jQuery验证插件。”

你不能，因为这不是jQuery验证插件的功能。验证插件只会在文件被选中后提供验证错误消息。它不会过滤文件浏览器窗口的内容。毕竟，如果真的如此，您永远不会看到验证错误，并且您不需要设置错误消息。

我想你会混淆验证插件的HTML5 accept属性和accept规则/方法。它们不是同一件事。只有Internet浏览器可以处理HTML5 accept属性时，才会在文件浏览器窗口内对文件类型进行过滤。

供您参考：

http://www.wufoo.com/html5/attributes/07-accept.html

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input#File_inputs

来源

2014-03-29 14:15:53 Sparky

jQuery验证插件的文件字段没有按预期工作

回答

相关问题