我的页面中有一个文件上传。我定义了一个名为“filetype”的属性。

<input filetype=".jpg|.jpeg|.png" id="attachments" type="file"> 

我希望当我从文件上传中选择一个文件时，使用 JavaScript 检查文件类型:

    function onSelect(e) { 
    if (!e.files[0].extension.match('/' + $("input[type='file']").attr('filetype') + '/i')) { 
        alert('file type is wrong'); 
        e.preventDefault(); 
    }     
} 

现在，当我选择 .jpg 格式的文件时，e.files[0].extension 将是

.jpg

和 '/' + $("input[type='file']").attr('filetype') + '/i' 是

/.jpg|.jpeg|.png/i

但是 e.files[0].extension.match('/' + $("input[type='file']").attr('filetype') + '/i') 返回

null

然后发出火灾警报。 为什么？我如何解决这个问题？ 谢谢。

请您参考如下方法:

您无法使用连接构建文字正则表达式，您需要使用 RegExp 构造函数。

我建议您执行以下操作:

<input data-filetype="jpg|jpeg|png" id="attachments" type="file"> 

然后:

function onSelect(e) { 
    // "this" is the file input 
    // if you attach the function to an event 
    // like `$('input:file').change(onSelect)` 
    var filetypes = $(this).data('filetype'); 
    var re = RegExp('\\.('+ filetypes +')$','i'); 
    if (!re.test(e.files[0].extension)) { 
        alert('file type is wrong'); 
        e.preventDefault(); 
    }     
}