4

在这里，我试图通过单击按钮上传 html/htm 文件。为此，我正在使用“输入类型=文件”，我已将其“接受”属性设置为仅接受 html/htm 扩展，如下所示：

<input type="file" name="htmla" id="htmla" accept="text/html" />

但它在不同的浏览器中表现出不同的行为

在Firefox中，它接受所有文件

在 chrome 中，它接受 html 以及图像

在 IE 中，和 firefox 一样

有没有办法通过 javascript 或 jquery 等任何方法使其仅接受 html/htm 文件？

注意：我在 MVC 4 中使用这个控件

4

3 回答 3

3

这是 HTML5 特定的属性。并非所有浏览器都支持它。对于那些不这样做的人，您将不得不在服务器上执行检查。另一种可能性是检查使用 javascript 选择的文件的扩展名。基本上你可以像这样得到选择的文件名：$('#htmla').val(). 然后是扩展的正则表达式。

于 2013-03-15T07:14:46.233 回答
2

标准输入控件中没有任何东西可以实现它。

是的，文件输入控件上有一个"accept"属性，您可以在其中指定所需的文件类型，但许多浏览器无法识别。因此，您可以做的最好的事情是检查用户使用 Javascript 或 Jquery 选择的文件的文件名（扩展名）。

function ValidateFile() {
        var fileName = document.getElementById("inputFileId").value
        if (fileName == "") {
            alert("upload a valid File with .htm extension");
            return false;
        }
        else if (fileName.split(".")[1].toUpperCase() == "HTM")
            return true;
        else {
            alert("Invalid File");
            return false;
        }
        return true;
    }

但是没有什么可以阻止用户将可执行文件重命名.html为例如。

于 2013-03-15T07:20:30.983 回答
1 
<script>
  function test(obj,filter){

    var file = obj.value.match(/[^\/\\]+$/gi)[0];
    var rx = new RegExp('\\.(' + (filter?filter:'') + ')$','gi');
    if(filter&&file&&!file.match(rx)){
      alert("check the file type, only html is accepted");
      //input file
      //it's totally a bad idea...
      //document.body.innerHTML = "<input type='file' onchange=\"test(this,'html');\" >";

    }
  }
</script>
<body>
    <input id="inputFile" type="file" onchange="test(this,'html');">
</body>

也许这应该适合你swfupload

于 2013-03-15T07:17:10.843 回答