25yicms利用ASP.NET(C#)+MSSQL技术全力打造功能最强大的营销型企业网站管理系统,企业做网站系统,做网站软件,提供div+css企业网站模板。
阅读内容

asp.net(C#)多文件上传(无限级上传文件)


时间:2010/02/02   来源:25亿

      大家经常做后台时候就会用到上传文件的组件,在asp.net(C#)中自带有FileUpload组件,直接添加就行,很快捷。但是如果需要多文件上传,就如同网易邮箱中添加附件一样有一个继续添加的按纽。这个时候我们就得采用其它的方法,

      以25亿企业网站管理系统中的源码作为实例深刻讲解asp.net(C#)多文件上传(无限级上传文件),并且兼容IE6、IE7、IE8、火狐(firefox)、谷歌、TT、360度、遨游等主流浏览器

      大家先看25亿企业网站管理系统后台内容管理栏目下产品系列,图片系统等的添加之中就有一个上传图片的功能,由于企业网站管理系统的灵活性,这时我们对上传图片这地方得灵活设置,也就是由用户自行添加上传图片的个数,这时需要用到多文件上传(无限级上传文件),如下图所示:

asp.net(C#)多文件上传
点击"增加上传文件"按纽下方就会增加一个上传文件的组件。

asp.net(C#)多文件上传

      在页面文件中的代码如下:
<div id="MyFile">
<input name="File" type="file" class="FileUpStyle" id="File1"/>&nbsp;&nbsp;<label id="Linkname"><%if (Request["type"].ToString().Trim() == "5") { Response.Write("文件"); } else { Response.Write("图片"); } %>名称:</label>
 <input name="Link" type="text" maxlength="20" class="inputtext"  size="20" value="25<%=gt.TranslateChineseToOther("亿企业网站管理系统", "zh-CN", Language)%>"/>
<input name="button1" id="button1" type="button" value="<%=gt.TranslateChineseToOther("增加上传文件", "zh-CN", Language)%>" onclick="addFile()" style="border-right: #6699cc 1px solid; border-top: #6699cc 1px solid; font-size: 9pt; border-left: #6699cc 1px solid; width: 100px; border-bottom: #6699cc 1px solid; display:none;">
<br />
</div>

      这是默认情况下上传文件的组件为一个,当我们点击"增加上传文件"按纽时调用如下js代码,就在其下方增加一个上传文件的组件。
function addFile()
{
//添加文件上传Html组件
var str ='<input type="file" name="File" class="FileUpStyle" /> &nbsp;&nbsp;<%=gt.TranslateChineseToOther("图片名称", "zh-CN", Language)%>:<input name="Link" type="text" maxlength="20" class="inputtext"  size="20" value="25<%=gt.TranslateChineseToOther("亿企业网站管理系统", "zh-CN", Language)%>"/><br>'
document.getElementById('MyFile').insertAdjacentHTML("beforeEnd",str)
}

       25亿企业网站管理系统全部兼容IE6、IE7、IE8、火狐(firefox)、谷歌、TT、360度、遨游等主流浏览器,为了在各浏览器中兼容,有一个地方需要注意,上述js代码中的insertAdjacentHTML方法仅在IE浏览器中才有效,也就是说insertAdjacentHTML方法是IE浏览器自带的一个方法,而在火狐(firefox)浏览器中没有insertAdjacentHTML方法,此时我们就得用js写出insertAdjacentHTML方法。大家可以查看25亿企业网站管理系统javascript文件夹下的commsystem.js中就有对insertAdjacentHTML方法的实现,代码如下:
if(typeof HTMLElement!="undefined" && !HTMLElement.prototype.insertAdjacentElement)
{
     HTMLElement.prototype.insertAdjacentElement = function(where,parsedNode)
     {
        switch (where)
        {
            case 'beforeBegin':
                this.parentNode.insertBefore(parsedNode,this)
                break;
            case 'afterBegin':
                this.insertBefore(parsedNode,this.firstChild);
                break;
            case 'beforeEnd':
                this.appendChild(parsedNode);
                break;
            case 'afterEnd':
                if (this.nextSibling) this.parentNode.insertBefore(parsedNode,this.nextSibling);
                    else this.parentNode.appendChild(parsedNode);
                break;
         }
     }

     HTMLElement.prototype.insertAdjacentHTML = function (where,htmlStr)
     {
         var r = this.ownerDocument.createRange();
         r.setStartBefore(this);
         var parsedHTML = r.createContextualFragment(htmlStr);
         this.insertAdjacentElement(where,parsedHTML)
     }

     HTMLElement.prototype.insertAdjacentText = function (where,txtStr)
     {
         var parsedText = document.createTextNode(txtStr)
         this.insertAdjacentElement(where,parsedText)
     }
}
      此时就可以完美兼容所有浏览器对insertAdjacentHTML方法的调用。至此asp.net(C#)多文件上传(无限级上传文件)讲解完成,如有不懂的请到25亿企业网站管理系统官方站技术社区进行提问。

点击次数:       打印此页  关闭