六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 125|回复: 0

JS仿网易多附件上传功能

[复制链接]

升级  32.67%

86

主题

86

主题

86

主题

举人

Rank: 3Rank: 3

积分
298
 楼主| 发表于 2013-2-7 19:26:11 | 显示全部楼层 |阅读模式
html

<div nowrap id="filespan">                 <input type="button"  value="添加附件" id="btnAdd" />         <div id="divMsg">尚未添加文件</div></div>

js

var isIE = (navigator.userAgent.indexOf("MSIE") != -1);var fileIndex = 0;var dic = new ActiveXObject("Scripting.Dictionary");function addFile() {    var obj;    if (isIE) {        obj = document.createElement("<input type=file id='hdnFile' onchange='getValue(this.value);' style='display:none' />");            } else {         obj = document.createElement("input");         obj.type = "file";         obj.id="hdnFile";         obj.setAttribute("style", "display:none;", 0);         obj.setAttribute("onchange", "javascript:getValue(this.value);", 0);    }    document.getElementById("filespan").appendChild(obj);    document.getElementById('hdnFile').click();      //addInputFile(spanId, fileId);    document.getElementById('divMsg').style.display = (dic.Count > 0)?'none':'';        }function addInputFile(spanId, fileId, str) {    var span = document.getElementById(spanId);    if (span != null) {        //检测存在性                //if (dic.Exists(fileId))        if(valueExists(str))        {            alert("不能重复添加相同文件");            return false;        }        var divObj = document.createElement("div"), fileObj, delObj;        divObj.id = fileId;        divObj.style.height='22';        var imgObj, fileObj, delObj;        if (isIE) {                    imgObj = document.createElement("<img src='unknown.gif' />");            fileObj = document.createElement("<input type=text readonly>");            delObj = document.createElement("<img src='delfile.jpg' onclick=delInputFile('" + spanId + "','" + fileId + "')>");                    } else {            imgObj = document.createElement("img");            imgObj.setAttribute("src", "unknown.gif", 0);            fileObj = document.createElement("input");            fileObj.type = "text";            fileObj.setAttribute("readonly", "readonly", 0);            //fileObj.setAttribute("onchange", "javascript:alert('');", 0);            delObj = document.createElement("img");            imgObj.setAttribute("src", "delfile.jpg", 0);            //delObj.type = "button";            delObj.setAttribute("onclick", "delInputFile('" + spanId + "','" + fileId + "')", 0);        }        fileObj.name = fileId;        fileObj.size = "50";            fileObj.value = str;        fileObj.className = "NoborderR";        //delObj.value = "删除";                divObj.appendChild(imgObj);        divObj.appendChild(document.createTextNode(" "));        divObj.appendChild(fileObj);                divObj.appendChild(document.createTextNode(" "));                divObj.appendChild(delObj);        span.appendChild(divObj);        //数据字典记录        dic.Add(fileId, str);            }}function delInputFile(spanId, fileId) {    var span = document.getElementById(spanId);    var divObj = document.getElementById(fileId);    if (span != null && divObj != null) {        span.removeChild(divObj);        //从数据字典移除        dic.Remove(fileId);        document.getElementById('divMsg').style.display = (dic.Count > 0)?'none':'';    }}function getValue(str){    var spanId = "filespan";    var fileId = "uploadfile" + (fileIndex++);    addInputFile(spanId, fileId, str);    document.getElementById(spanId).removeChild(document.getElementById('hdnFile'));}function valueExists(str){     a = (new VBArray(dic.Items())).toArray();   //获取条目。     for (i in a)                  //遍历该 dictionary。   {      if(a[i]==str)        return true;   }   return false;}//-->
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表