如何用javascript 模拟 <input type="file"/> 上传文件

Question

本帖最后由 realliguangyu82 于 2012-04-14 00:16:14 编辑

Answer 1

<input type='file' id='loca' style='display:none'>
<input type='button' id='test' value='浏　览'>
<input type='button' id='uper' value='上　传'>
<script>
! +"\v1" || (HTMLElement.prototype.click = function(){
    var eve = this.ownerDocument.createEvent("MouseEvents");
    eve.initMouseEvent("click", true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
    this.dispatchEvent(eve);
});function $(o){return document.getElementById(o) || o}
$("test").onclick = function() {
     $("loca").click(); 
}
$("uper").onclick = function() {
     alert($("loca").value); // up data
}
</script>

Answer 2

楼上的HTMLElement.prototype 应该在IE没效吧选中文件？ 由人来选择？还是也是模拟？模拟的话，办不到的，这涉及到安全问题，浏览器不允许这么做的其他的，模拟点击、直接提交，可以做到

Answer 3

浏览器的开发商 认为 这是一种可能的 潜在的 危害 客户端的行为因为 不允许 代码编写尝试这样的操作这个考虑不考虑不在我们 在于浏览器的开发商当然，在IE下，ActiveX有些可能下我去翻阅下再来试下...

Answer 4

这个功能要借助于第三方控件来实现。JS不能实现。IE下可用ActiveX,FireFox下可用NPAPI。

Answer 5

楼主可以试试这个控件。
此控件是基于标准HTTP协议实现的文件上传功能。优势是扩展性非常好，整合简单，支持批量上传文件和上传文件夹功能，适合各种简单WEB项目。
另外一个特点是支持自动上传指定的本地文件。单文件上传演示单文件整合代码： 服务器返回消息：<input id="txtFilePath" type="text" size="50" />
<script type="text/javascript" language="javascript">
var uploaderMgr = new HttpUploaderSingleMgr();
uploaderMgr.Config["PostUrl"] = "http://localhost:8080/asp.net/upload.aspx";
uploaderMgr.Load();
uploaderMgr.CompleteHook = function(msg)
{
document.getElementById("txtFilePath").value = msg;
}; window.onload = function()
{
uploaderMgr.Init();
};
</script>

Answer 6

这个是Xproer.HttpUploader吧。我们公司现在做的一个OA项目就是用的这个控件。使用起来比较简单。还不错。

Answer 7

一般来讲JS端不能直接给文件上传控件赋值，如果要直接赋值上传的话只能借助于第三方控件来实现。
我们公司去年做的一个政府的OA项目就是使用的第三方控件。

Answer 8

我只是兼容非IE的实现JS触发input的click事件，虽然隐藏了file-input，它的click触发任然通过button-input的手动click所引起，不存在安全限制问题。
至于如何实现文件上传，可看看cloudgamer的研究SITE BY http://www.cnblogs.com/cloudgamer/archive/2008/10/20/1314766.html

Answer 9

通过提交页面 模拟 选择文件，然后确认
<input type="file" id="local_file" name="local_file" size="50" style="display:none"/>后台通过下面这个类获取文件流
MultipartFormData data = new MultipartFormData(request);            MultipartFormData.Entity entity = data.getEntity("local_file");
entity.getInputStream()
由于是手动选择文件，所以获取的流为空值要求是模拟file来上传文件获取选择的文件流

Answer 10

各位高手有没有办法啊，主要通过javascript 获取一个文件流 提交到后台也行不要有插件，自己来实现 javascript 模拟 uploadfile 提交给后台后台获取到流就行

Answer 11

websocket另外 时间不要耗在没意义的东西上面