如何从表单中获取文件内容?

时间:2011-12-27 13:52:05

标签: javascript html

如何从HTML表单中获取文件的内容?这是我正在使用的一个例子。所有它输出的内容类似于“C:\ Fake Path \ nameoffile

<html>
<head>

<script type="text/javascript">
    function doSomething(){
        var fileContents = document.getElementById('idexample').value;
        document.getElementById('outputDiv').innerHTML = fileContents;
    }
</script>

</head>
<body >

<form name = "form_input" enctype="multipart/form-data">

<input type="file" name="whocares" id="idexample" />
<button type="button" onclick="doSomething()">Enter</button>

</form>

<div id="outputDiv"></div>

</body>
</html>

编辑: 似乎解决方案很难以这种方式实现。我想要完成的是将文件发送到我的网络服务器上的python脚本。这是我第一次尝试这种事情,所以欢迎提出建议。我想我可以将python脚本放在我的cgi文件夹中,并使用类似......

之类的内容将值传递给它
/cgi/pythonscript.py?FILE_OBJECT=fileobjecthere&OTHER_VARIABLES=whatever

这是将文件内容发送到网络服务器而不是让javacript直接使用FileReader打开它的更好的解决方案吗?

4 个答案:

答案 0 :(得分:5)

您实际上可以使用新的FileReader对象执行此操作。

试试这个working example

function doSomething()
{
    var file = document.getElementById('idexample');

    if(file.files.length)
    {
        var reader = new FileReader();

        reader.onload = function(e)
        {
            document.getElementById('outputDiv').innerHTML = e.target.result;
        };

        reader.readAsBinaryString(file.files[0]);
    }
}

(适用于最新版本的Chrome和Firefox)

答案 1 :(得分:0)

无法获取表单中文件的内容,而无需将表单提交给您的服务器。

答案 2 :(得分:0)

是肯定的。替换下面给出的输入行,然后它将工作:)

<input type="file" ACCEPT="text/html" name="whocares" id="idexample" />

答案 3 :(得分:0)

正如Neal所说 - 这是用于向服务器提交文件。

有关您现有代码的另一件值得一提的事。您的表单应使用POST提交数据。你没有定义方法,默认是GET

<form name = "form_input" enctype="multipart/form-data" method="POST>