42

我有一个简单的 HTML 上传表单，我想指定一个默认扩展名（例如“*.drp”）。我已经读过这样做的方法是通过输入标签的 ACCEPT 属性，但我不知道具体如何。

<form enctype="multipart/form-data" action="uploader.php" method="POST">
Upload DRP File:
<input name="Upload Saved Replay" type="file" accept="*.drp"/><br />
<input type="submit" value="Upload File" />
</form>

编辑 我知道可以使用 javascript 进行验证，但我希望用户只在他的弹出对话框中看到“.drp”文件。此外，我不太关心此应用程序中的服务器端验证。

4

7 回答 7

37

对于像你的“.drp”这样的特定格式。您可以直接在 accept=".drp" 中传递它，它将为此工作。

但没有“ * ”

<input name="Upload Saved Replay" type="file" accept=".drp" />
<br/>

于 2013-06-11T10:44:21.657 回答
27

我使用 javascript 检查文件扩展名。这是我的代码：

HTML

<input name="fileToUpload" type="file" onchange="check_file()" >

......

javascript

function check_file(){
                str=document.getElementById('fileToUpload').value.toUpperCase();
        suffix=".JPG";
        suffix2=".JPEG";
        if(str.indexOf(suffix, str.length - suffix.length) == -1||
                       str.indexOf(suffix2, str.length - suffix2.length) == -1){
        alert('File type not allowed,\nAllowed file: *.jpg,*.jpeg');
            document.getElementById('fileToUpload').value='';
        }
    }
于 2011-07-22T10:21:25.007 回答
10

接受属性需要 MIME 类型，而不是文件掩码。例如，要接受 PNG 图像，您需要 accept="image/png"。您可能需要找出浏览器认为您的文件类型是什么 MIME 类型，并相应地使用它。但是，由于“drp”文件看起来并不标准，您可能必须接受通用 MIME 类型。

此外，似乎大多数浏览器可能不支持此属性。

过滤文件上传的更好方法是在服务器端。这很不方便，因为偶尔的用户可能会浪费时间上传文件，只是为了知道他们选择了错误的文件，但至少你会有某种形式的数据完整性。

或者，您可以选择在提交表单之前使用 JavaScript 进行快速检查。只需检查文件字段值的扩展名，看看它是否为“.drp”。这可能会比接受属性更受支持。

于 2008-10-31T16:53:29.227 回答
1

你可以使用javascript来做到这一点。在提交函数中获取表单字段的值，解析出扩展名。

你可以从这样的事情开始：

<form name="someform"enctype="multipart/form-data" action="uploader.php" method="POST">
<input type=file name="file1" />
<input type=button onclick="val()" value="xxxx" />
</form>
<script>
function val() {
    alert(document.someform.file1.value)
}
</script>

我同意 alexmac - 在服务器端也这样做。

于 2008-10-31T16:56:43.527 回答
1

我不会使用这个属性，因为大多数浏览器都会忽略它，因为 CMS 指出。

一定要使用客户端验证，但只能与服务器端结合使用。任何客户端验证都可以进行。

稍微偏离主题，但有些人检查内容类型以验证上传的文件。您需要注意这一点，因为攻击者可以轻松更改它并上传例如 php 文件。请参阅以下示例：http ://www.scanit.be/uploads/php-file-upload.pdf

于 2008-10-31T17:14:42.057 回答
0

accept 属性指定表单目标将正确处理的内容类型（MIME 类型）的逗号分隔列表。不幸的是，所有主要浏览器都忽略了此属性，因此它不会以任何方式影响浏览器的文件对话框。

于 2008-10-31T16:56:36.383 回答
-2

几行的另一种解决方案

function checkFile(i){
  i = i.substr(i.length - 4, i.length).toLowerCase();
  i = i.replace('.','');
  switch(i){
    case 'jpg':
    case 'jpeg':
    case 'png':
    case 'gif':
      // do OK stuff
      break;
    default:
      // do error stuff
      break;
  }
}
于 2013-05-31T13:16:22.877 回答