上传，下载文件，可以看到文件大小，上行 ，下行 速度，以及什么时候可以上传或者下载完毕

如果界面要挺炫的话，可以考虑flash来做

解决方案 »

  1.   

    建议用jquery-uolodyify组件，可以根据提供的demo试一下。
      

  2.   

    网上有大文件上传控件，你可以搜一下。也有一些比较成熟的HTTP断点续传控件。下载类的HTTP文件下载控件你也可以搜到。
      

  3.   

    网上有一个Web超大文件上传断点续传控件：http://www.cnblogs.com/xproer/archive/2012/10/26/2741264.html
    此控件支持100G文件的断点续传操作，提供了完善的开发文档，支持文件MD5验证，支持文件批量上传。
    支持浏览器：Internet Explorer 6,Internet Explorer 7,Internet Explorer 8,Internet Explorer 9
    Maxthon(遨游)1.x,Maxthon(遨游)2.x,TT浏览器,QQ浏览器,360安全浏览器,
    Chrome(Google浏览器),Maxthon3.x,360极速浏览器6.x,Firefox
    粘贴文件，简化选择文件操作：文件MD5值计算进度：文件MD5值计算完毕服务器根据MD5检测是否存在相同文件续传文件从服务器加载文件列表文件上传中文件上传完毕上传文件夹与Discuz!X2整合-后台安装断点续传控件与Discuz!X2整合-后台启用断点续传控件与Discuz!X2整合-后台断点续传控件启用成功与Discuz!X2整合-前台发帖页面与Discuz!X2整合-上传
    页面调用示例代码：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>HTTP断点续传控件与MySQL数据库演示页面(UTF-8)</title>
        <link href="HttpUploader/HttpUploader.css" type="text/css" rel="Stylesheet"/>
        <script type="text/javascript" charset="utf-8" src="HttpUploader/FileLister.js"></script>
        <script type="text/javascript" charset="utf-8" src="HttpUploader/HttpUploader.js"></script>
        <script type="text/javascript" charset="utf-8" src="HttpUploader/combinbox.js"></script>
        <script type="text/javascript" src="HttpUploader/jquery-1.3.2.min.js"></script>
        <script language="javascript" type="text/javascript">
         var cbItemLast = null;
         var cbMgr = new CombinBoxMgr();     $(document).ready(function()
         {
         cbMgr.LoadInControl("FilePanel");
         cbMgr.Init();
         });
        </script>
    </head>
    <body>
    <div id="FilePanel"></div>
    </body>
    </html>
      

  4.   

    楼主试试这个控件：http://www.cnblogs.com/xproer/archive/2011/03/26/1996322.html
    默认界面批量下载中下载中...下载完毕
    示例代码：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>HTTP文件下载控件演示页面</title>
        <link type="text/css" href="HttpDownloader/HttpDownloader.css" rel="Stylesheet"/>
        <script type="text/javascript" src="HttpDownloader/HttpDownloader.js" charset="utf-8"></script>
    </head>
    <body>
    <input type="button" value="下载测试文件" onclick="StartDown()" />
    <div id="downDiv"></div>
        <script type="text/javascript" language="javascript">
         var downerMgr = new FileDownloaderMgr();
         downerMgr.Config["Folder"] = "F:\\";
         downerMgr.LoadTo("downDiv"); window.onload = function()
    {
    downerMgr.Init();
    };

    function StartDown()
    {
    //添加到下载队列
    downerMgr.AddFile("http://www.ncmem.com/images/ico-ftp.jpg");
    downerMgr.PostFirst();
    } function copyFile()
    {
    var obj = new ActiveXObject(downerMgr.ActiveX["Partition"]);
    obj.CopyFile("f:\\ftp\\test.gif","f:\\ftp\\test1.gif");
    } function copyFolder()
    {
    var obj = new ActiveXObject(downerMgr.ActiveX["Partition"]);
    obj.CopyFile("f:\\ftp\\test.gif","f:\\ftp\\ftp1");
    }

    function moveFile()
    {
    var obj = new ActiveXObject(downerMgr.ActiveX["Partition"]);
    obj.MoveFile("f:\\ftp\\test.gif","f:\\ftp\\test2.gif");
    }

    function moveFolder()
    {
    var obj = new ActiveXObject(downerMgr.ActiveX["Partition"]);
    obj.MoveFile("f:\\ftp\\test2.gif","f:\\ftp\\ftp1");
    }

    </script>
    <input type="button" value="复制到文件" onclick="copyFile()" />
    <input type="button" value="复制到文件夹" onclick="copyFolder()" />
    <input type="button" value="移动文件" onclick="moveFile()" />
    <input type="button" value="移动到文件夹" onclick="moveFolder()" />
    </body>
    </html>
      

  5.   

    这个不错。最近公司在做一个云存储的项目，也需要实现一个大附件上传功能，在网上找了很多控件都无法满足需求。Flash的控件也用过，一样无法满足需求。最后还是用的这个控件。
      

  6.   

    jquery uploadfile 可以满足你的要求了