使用简单的正则表达式验证浏览器上传文件名和扩展名

时间:2011-05-12 06:10:36

标签: javascript regex validation file-upload cross-browser

我正确的正则表达式。仅适用于Firefox。我将如何制作这种跨浏览器,跨平台的方式。由于它是文件名和扩展名验证,因此我使用文件上传控件。

^[a-zA-Z0-9_\.]{3,28}(.pdf|.txt|.doc|.docx|.png|.gif|.jpeg|.jpg|.zip|.rar)$

匹配文件名不能为空[3,28个字符长]。

扩展名必须在群组内。

当这在forefox工作时非常棒我假设因为firefox中的fileUpload.value = Filename.extension。它在Google Chrome和IE中失败了。我使用上面的.net正则表达式验证器和启用ClientScript。

我知道如何在服务器上验证它,所以请不要使用服务器端解决方案。

注意:

Google Chrome:

将fileupload控件值提供为c:\ fakePath \ filename.extension

IE:

提供完整路径。

2 个答案:

答案 0 :(得分:3)

如果您有时拥有完整路径但只对文件名感兴趣,则无法使用^开头。应该转义文件的点。

您可以尝试这样的事情:

[^\\/]{3,}\.(pdf|txt|doc|docx|png|gif|jpeg|jpg|zip|rar)$


因为它看起来只有Firefox的文件,但与其他浏览器的完整路径 我总是在您的字符串中添加前缀/,然后在最后一个fileseprator /\之后验证最后一部分。

此示例使用lookahead在文件之前检查fileseparator(或手动添加/),并允许检查max 28 char for filename。请参阅此online regex tester

(?<=[\\/])[\w\.]{3,28}\.(?:pdf|txt|doc|docx|png|gif|jpeg|jpg|zip|rar)$

答案 1 :(得分:1)

按照目前的情况,你的正则表达式会像下面那样验证垃圾:

  • ....pdf
  • ____pdf

它也拒绝完全有效的文件:

  • i.jpg
  • my-pic.jpg
  • pic.JPG

最简单的方法是分多步验证:

  1. 提取扩展程序:

    \.[a-zA-Z]{3,4}$
    
  2. 小写扩展名并根据可接受值的数组对其进行验证。

  3. 可选择验证文件的名称(虽然我建议改为清除它):

    [a-zA-Z0-9_-]+(?:\.[a-zA-Z0-9_-]+)*