18910140161

Html

首页 >> 前端开发 >> Html

共享:简单的HTML编辑器

顺晟科技

2021-08-06 10:40:52

187

（1）JavaScript部分：

 

 

// JScript 文件
//////////////////////////////////工具方法
var ie=document.all;
function $(id)
{
    return document.getElementById(id);
}
function Show(id)
{
    $(id).style.display="block";
}
function Hide(obj)
{
    obj.style.display="none";
}

function HideAll()    //隐藏所有选项
{
    Hide($("divList"));
    Hide($("fontFace"));
    Hide($("divInOut"));
    Hide($("fontSize"));
    Hide($("dvForeColor"));
    Hide($("divAlign"));
}

///////////////////////////////////工具方法
////////文档加载函数

        
window.onload=function()
{
    $("c").contentWindow.document.designMode = "On";     //开启编辑区设计功能
    var d = $("c").contentWindow.document;           //获取帧文档对象，准备完成初始化工作
    var s = "<body style=\'font:normal 12px arial;padding:4px 6px;\'><div></div></body>"
    d.open()   
    d.write(s)  
    d.close()   
}

function ShowList(id)
{
    HideAll();        //隐藏其他选项
    Show(id);         //显示当前选项
}       

function fontname(obj)       //应用字体种类
{
    format(\'fontname\',obj.innerHTML);   
    obj.parentNode.style.display=\'none\';       //出去前面的字体样式？？？

}

function fontsize(size,obj)            //应用字体大小
{
    format(\'fontsize\',size);
    obj.parentNode.style.display=\'none\';
}

function format(type, para)           //执行样式,字体颜色样式设置
{
    var c = $("c").contentWindow;
    c.focus();
    if(!para)
    {
        if(ie)
        {
         c.document.execCommand(type);
        }else
        {
         c.document.execCommand(type,false,false);
        }
    }else
    {
        c.document.execCommand(type,false,para);
    }
    c.focus();
}


function Pop(id,width,height)
{
    divCover();        //覆盖层
    var dialog=$(id);
    var os=dialog.style;
    os.position="absolute";
    os.top="10px";
    os.left=(document.body.offsetWidth/2-width/2)+"px";
    os.zIndex="100";
    os.display="block";
}


function divCover()        //覆盖层
{
    var objSelects=document.getElementsByTagName("select");            ///// ？？？？？？？？？？？？？
    for(var i=0;i<objSelects.length;i++)
    {
        objSelects[i].style.visibility="hidden";
    }
    var obj=document.getElementsByTagName("embed");
    for(var i=0;i<obj.length;i++)
    {
        obj[i].style.visibility="hidden";
    }
   
   
    var over=$("divOver");                            ////////////////设置覆盖层DIV样式，位置
    if(!over)
    {
        over=document.createElement("div");
    }
    over.id="divOver";
    var oS=over.style;
    oS.left="0px";
    oS.top="0px";
    oS.position = "absolute";
    oS.zIndex = "1";
    var height=document.body.scrollHeight+20;
    if((window.screen.availHeight-window.screenTop-24)>height){
        height= window.screen.availHeight-window.screenTop-24;
    }
    height=height+"px";
    var width=window.screen.availWidth;
    if(ie) width=window.screen.availWidth-20;
    width=width+"px";
    over.innerHTML = "<table width="+width+" height="+height+" style=\'background-color:black; filter: Alpha(Opacity=40);-moz-opacity:0.4;\'></div>";
    document.body.appendChild(over);                    ////////////////设置覆盖层DIV样式，位置     
}

function addImg()        /////插入相片
{
    var i=$("txtImg").value;
    if(i!="" && i.length>1 && i!="http://")
    {
        $("c").contentWindow.document.body.innerHTML += "<img src="+i+" />";     //增加相片到编辑区
        CloseImg();
    }else
    {
        $("imgTip").style.display="block";
    }
}

function CloseImg()             //关闭相片覆盖层
{
    $("txtLink").value="";
    Hide($("imgTip"));
    HidePop("divImg");       
}

function HidePop(divID)     //关闭覆盖层
{
    $(divID).style.display="none";
    hideOver();
}

function hideOver()     //关闭覆盖层
{
    var over=$("divOver");
    if(over)
    {
        over.innerHTML="";
    }
    var objSelects=document.getElementsByTagName("select");             //// ？？？？？？？？？？？？？
    for(var i=0;i<objSelects.length;i++)
    {
        objSelects[i].style.visibility="visible";
    }
    var obj=document.getElementsByTagName("embed");
    for(var i=0;i<obj.length;i++)
    {
        obj[i].style.visibility="visible";
    }
}

function BtnAddLink()                   ////创建超级链接窗体
{
    var c = $("c").contentWindow;
    if(ie)
    {
        var sText = c.document.selection.createRange();              
        format("CreateLink");
        sText.parentElement().outerHTML=sText.parentElement().outerHTML.replace("<A","<A target="_blank"");
    }
    else
        Pop(\'divLink\',\'300\',\'160\');
    return false;
}

function addLink(){                     ////增加链接到编辑区    
    var l=$("txtLink").value;
    if(l!="" && l.length>1 && l!="http://")
    {
        format("CreateLink",l);
        CloseLink();
    }else
    {
        $("linkTip").style.display="block";
    }
}
function CloseLink()
{                     ///////关闭链接窗口
    $("txtLink").value="http://";
    Hide($("linkTip"));
    HidePop("divLink");
}


////切换编辑区模式
var currentModel ="edit";
var designMode = "On";
var isEdit = true;
function setModel(newModel)
{  
    if(newModel != currentModel)
    {
        //设置全局变量
        var designMode = $("c").contentWindow.document.designMode;
        var html = $("c").contentWindow.document.body.innerHTML;
        var text = $("c").contentWindow.document.body.innerText;
        var idocument = $("c").contentWindow.document;
       
        switch(newModel)
        {
            case "code":
               if(designMode == "On")    //如果可以编辑
               {
                    $("c").contentWindow.document.body.innerText = html;                     
               }else
               {
                    var temp = html;
                    $("c").contentWindow.document.designMode = "On";   //如果不可编辑，打开编辑模式
                    idocument.open();
                    idocument.write( "<body style=\'font:normal 12px arial;padding:4px 6px;\'><div></div></body>");
                    $("c").contentWindow.document.body.innerText = temp;
                    idocument.close();
                    temp = null;
               }
               currentModel = "code";
               isEdit = false;
               Btdisabled("1");
               break;
            case "edit":
               idocument.body.disabled = false;
               if(designMode == "On")   
               {
                    $("c").contentWindow.document.body.innerHTML = text;                     
               }else
               {
                    var temp = html;  
                    $("c").contentWindow.document.designMode = "On";   
                    idocument.open();
                    idocument.write(temp);
                    idocument.close();
                    temp = null;
               }
               $("c").contentWindow.focus();
               currentModel = "edit";
               Btdisabled("2");
               isEdit = true;
               break;
            case "view":
                var temp;
                if(isEdit)
                {
                    temp = html;
                }else
                {
                    temp = text;
                }
                $("c").contentWindow.document.designMode = "Off";      //关闭编辑区设计功能           
                idocument.open();
                idocument.write(temp);
                idocument.close();
                currentModel = "view";
                Btdisabled("3");
                isEdit = false;
                break;
        }
    }
}

function Btdisabled(id)
{
    $("ViewBt").disabled = false;
    $("EditBt").disabled = false;
    $("CodeBt").disabled = false;
    switch(id)
    {
        case "1": $("CodeBt").disabled = true;break;
        case "2": $("EditBt").disabled = true;break;
        case "3": $("ViewBt").disabled = true;break;       
    }  
}

/*

function GetIframeInnerHtml(objIFrame)
{
    var iFrameHTML = "";
    if (objIFrame.contentDocument)
    {
        // For NS6
        iFrameHTML = objIFrame.contentDocument.innerHTML;
    }
    else if (objIFrame.contentWindow)
    {
        // For IE5.5 and IE6
        iFrameHTML = objIFrame.contentWindow.document.body.innerHTML;
    }
    else if (objIFrame.document)
    {
        // For IE5
        iFrameHTML = objIFrame.document.body.innerHTML;
    }
    return iFrameHTML;
}

 

（2）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>HTML编辑器</title>
        <script type="text/javascript"  src="editor01.js"></script>
        <link  href="editor.css" type="text/css" rel="Stylesheet"/>
</head>
<body>
    <div class="tool">
        <a href="javascript:void(0)" class="u"  onclick="ShowList(\'fontFace\');return false;" title="字体"><img src="images/font.gif" alt="" /></a>
        <a href="javascript:void(0)" class="icoOdt"  id="A1" onclick="ShowList(\'fontSize\');return false;" title="字体大小"><img src="images/fontsize.gif" alt="" /></a>
        <img src="images/break.gif" alt="" />
        <a href="javascript:void(0)" class="b"  onclick="format(\'Bold\');return false;" title="加粗"><img src="images/b.gif" alt="" /></a>
     <a href="javascript:void(0)" class="i"  onclick="format(\'Italic\');return false;" title="斜体"><img src="images/i.gif" alt="" /></a>
     <a href="javascript:void(0)" class="u"  onclick="format(\'Underline\');return false;" title="下划线"><img src="images/u.gif" alt="" /></a>
     <img src="images/break.gif" alt="" />
     <a href="javascript:void(0)" class="icoOdt"  id="A3" onclick="ShowList(\'divAlign\');return false;" title="对齐方式"><img src="images/align.gif" alt="" /></a>
     <a href="javascript:void(0)" class="u"  onclick="ShowList(\'divList\');return false;" title="编号"><img src="images/list.gif" alt="" /></a>
     <a href="javascript:void(0)" class="icoOdt"  id="imgInOut" onclick="ShowList(\'divInOut\');return false;" title="缩进"><img src="images/indent.gif" alt="" /></a>
     <img src="images/break.gif" alt="" />
     <a href="javascript:void(0)" class="icoOdt"  id="A2" onclick="ShowList(\'dvForeColor\');return false;" title="字体颜色"><img src="images/fontcolor.gif" alt="" /></a>
     <a href="javascript:void(0)" class="icoUrl"  onclick="BtnAddLink()" title="超链接"><img src="images/a.gif" alt="" /></a>
     <img src="images/break.gif" alt="" />
     <a href="javascript:void(0)" class="icoOdt"  id="A4" onclick="Pop(\'divImg\',\'300\',\'160\');return false;" title="插入图片"><img src="images/img.gif" alt="" /></a>
  
    </div>
   

    <div class="frame">
        <iframe id="c" scrolling="auto" onfocus="HideAll()" frameborder="10" style="border:0;width:;height:300px;font-size:12px; background-color:#D3D3D3;" marginwidth="0" marginheight="0"></iframe>
    </div>
   
    <div id="fontSize" class="eMenu" style="display:none;top:30px;left:62px;width:90px;height:130px">
   <a href="javascript:void(0)" onclick="fontsize(1,this)" class="n" style="font-size:xx-small;line-height:120%;">极小</a>
   <a href="javascript:void(0)" onclick="fontsize(2,this)" class="n" style="font-size:x-small;line-height:120%;">特小</a>
   <a href="javascript:void(0)" onclick="fontsize(3,this)" class="n" style="font-size:small;line-height:120%;">小</a>
   <a href="javascript:void(0)" onclick="fontsize(4,this)" class="n" style="font-size:medium;line-height:120%;">中</a>
   <a href="javascript:void(0)" onclick="fontsize(5,this)" class="n" style="font-size:large;line-height:120%;">大</a>
   <a href="javascript:void(0)" onclick="fontsize(6,this)" class="n" style="font-size:x-large;line-height:120%;height:25px">特大</a>
 </div>  
 <div id="fontFace" class="eMenu" style="display:none;top:30px;left:4px;width:100px;height:236px;">
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'宋体\';">宋体</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'黑体\';">黑体</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'楷体_GB2312\';">楷体_GB2312</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'隶书\';">隶书</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'幼圆\';">幼圆</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px Arial;">Arial</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'Arial Narrow\';">Arial Narrow</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'Arial Black\';">Arial Black</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'Comic Sans MS\';">Comic Sans MS</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px Courier;">Courier</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px System;">System</a>
        <a href="javascript:void(0)" onclick="fontname(this)" class="n" style="font:normal 12px \'Times New Roman\';">Times New Roman</a>
    </div>
    <div id="divList" class="eMenu" style="display:none;top:30px;left:252px;width:56px;height:40px;">
        <a href="javascript:void(0)" onclick="format(\'Insertorderedlist\');Hide(this.parentNode)" class="n">数字列表</a>
        <a href="javascript:void(0)" onclick="format(\'Insertunorderedlist\');Hide(this.parentNode)" class="n">符号列表</a>
    </div>
   
    <div id="divInOut" class="eMenu" style="display:none;top:30px;left:280px;width:56px;height:40px;">
        <a href="javascript:void(0)" onclick="format(\'Indent\');Hide(this.parentNode)" class="n">增加缩进</a>
        <a href="javascript:void(0)" onclick="format(\'Outdent\');Hide(this.parentNode)" class="n">减少缩进</a>
    </div>
   
    <div id="divAlign" class="eMenu" style="display:none;top:30px;left:226px;width:60px;height:60px;">
        <a href="javascript:void(0)" onclick="format(\'Justifyleft\');Hide(this.parentNode)" class="n">左对齐</a>
        <a href="javascript:void(0)" onclick="format(\'Justifycenter\');Hide(this.parentNode)" class="n">居中对齐</a>
        <a href="javascript:void(0)" onclick="format(\'Justifyright\');Hide(this.parentNode)" class="n">右对齐</a>
    </div>
 <div id="dvForeColor" class="eMenu" style="display:none;top:30px;left:310px;width:90px;">
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#800000\');Hide(this.parentNode);" class="n cs fRd1"><b class="cb"></b><span>暗红色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#800080\');Hide(this.parentNode);" class="n cs fRd2"><b class="cb"></b><span>紫色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#F00000\');Hide(this.parentNode);" class="n cs fRd3"><b class="cb"></b><span>红色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#F000F0\');Hide(this.parentNode);" class="n cs fRd4"><b class="cb"></b><span>鲜粉色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#000080\');Hide(this.parentNode);" class="n cs fBu1"><b class="cb"></b><span>深蓝色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#0000F0\');Hide(this.parentNode);" class="n cs fBu2"><b class="cb"></b><span>蓝色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#00F0F0\');Hide(this.parentNode);" class="n cs fBu3"><b class="cb"></b><span>湖蓝色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#008080\');Hide(this.parentNode);" class="n cs fGn1"><b class="cb"></b><span>蓝绿色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#008000\');Hide(this.parentNode);" class="n cs fGn2"><b class="cb"></b><span>绿色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#808000\');Hide(this.parentNode);" class="n cs fGn3"><b class="cb"></b><span>橄榄色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#00F000\');Hide(this.parentNode);" class="n cs fGn4"><b class="cb"></b><span>浅绿色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#F0C000\');Hide(this.parentNode);" class="n cs fYl1"><b class="cb"></b><span>橙黄色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#000000\');Hide(this.parentNode);" class="n cs fBk1"><b class="cb"></b><span>黑色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#808080\');Hide(this.parentNode);" class="n cs fBk2"><b class="cb"></b><span>灰色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#C0C0C0\');Hide(this.parentNode);" class="n cs fBk3"><b class="cb"></b><span>银色</span></a>
    <a href="javascript:void(0)" onclick="format(\'ForeColor\',\'#FFFFFF\');Hide(this.parentNode);" class="n cs fWt0"><b class="cb"></b><span>白色</span></a>
 </div>
 <form name="imgForm" method="post" action="upload.aspx" enctype="multipart/form-data" onsubmit="return InsertImg();">
        <div id="divImg" class="hide" style="width: 400px; height: 250px; border: 1pt solid #238cbc;background: white;">
            <div class="title">
                插入图片
            </div>
            <div class="content">
                <div style="margin: 5px; font-size: 12px; color: #666666;">
                    网络图片链接地址：
                </div>
                <input id="txtImg" type="text" style="width: 180px;"/><br />
                <div id="imgTip" style="color: Red; font-size: 12px; display: none;">
                    图片地址填写错误，请重新填写。
                </div>
                <br />
                    <input id="btnInsertImg" type="button" value="确定" onclick="addImg();"/>&nbsp; &nbsp;
                    <input id="Button5" type="button" value="取消" onclick="CloseImg();"/>
                <hr style="width: 356px" />
                <div style="margin: 3px; font-size: 12px; color: #666666;">
                    本地上传：
                </div>
                <div>
                    <input id="File1" type="file" name="file" style="width: 260px"/>
                    <br />
                    <br />
                    <input id="Submit" type="submit" value="上传"/>
                </div>
            </div>
        </div>
    </form>
    <div id="divLink" class="hide" style="width:260px;height:160px;border:1pt solid #238cbc;background:white;">
     <div class="title">添加链接</div>
     <div class="content">
         <div style="margin:0;font-size:12px;color:#666666;">填写链接地址</div>
         <input id="txtLink" value="http://" type="text" style="width:160px;" /><br />
         <div id="linkTip" style="color:Red;font-size:12px;display:none;">链接填写错误，请重新填写。</div>
            <input id="btnInsertLink" type="button" value="确定" onclick="addLink();" />
            <input id="Button3" type="button" value="取消" onclick="CloseLink();" />
        </div>
 </div>
 
 <div style="padding:10px">
        <input id="CodeBt" type="button" value="源码" onclick="setModel(\'code\');" />
        <input id="ViewBt" type="button" value="预览" onclick="setModel(\'view\');"/>
        <input id="EditBt" type="button" value="编辑" onclick="setModel(\'edit\');"/>
    </div>
       
</body>
</html>

 

（3）CSS部分：

         body{font-size:12px;margin:0;padding:0;color:black;}
        .tool{height:30px;padding-left:4px;background:url(images/bg.jpg) repeat-x;border-left:1pt ridge #85B2D1;border-right:1pt solid #85B2D1;}
        .frame{border:1pt solid #85B2D1;border-top:0;margin:0px;padding:0;height:;background:#D3D3D3;}
         div a.n{height:16px;line-height:16px;display:block;padding:2px;color:#000000;text-decoration:none}
         div a:hover{background:#85B2D1;}
        .tool a:hover{background:url(images/bgfocus.gif);}
        .eMenu{position:absolute;background:#FFFFFF;border:1px solid #85B2D1;padding:1px}
        .hide{display:none;}                 
        .title{font-size:16px;font-weight:bold;color:black;padding-left:8px;padding-top:6px;border-bottom:1pt dotted #e6e6e6;height:24px;}
        .content{margin:10px auto auto 20px;}
        .cs .cb{font-size:0;display:block;width:10px;height:8px;position:absolute;left:4px;top:3px;cursor:hand!important;cursor:pointer}
        .cs span{position:absolute;left:19px;top:0px;cursor:hand!important;cursor:pointer;color:#333}
        a.cs{height:15px;position:relative}
        *:lang(zh) a.cs{height:12px}
        .fRd1 .cb{background-color:#800}
        .fRd2 .cb{background-color:#800080}
        .fRd3 .cb{background-color:#F00}
        .fRd4 .cb{background-color:#F0F}
        .fBu1 .cb{background-color:#000080}
        .fBu2 .cb{background-color:#00F}
        .fBu3 .cb{background-color:#0FF}
        .fGn1 .cb{background-color:#008080}
        .fGn2 .cb{background-color:#008000}
        .fGn3 .cb{background-color:#808000}
        .fGn4 .cb{background-color:#0F0}
        .fYl1 .cb{background-color:#FC0}
        .fBk1 .cb{background-color:#000}
        .fBk2 .cb{background-color:#808080}
        .fBk3 .cb{background-color:#C0C0C0}
        .fWt0 .cb{background-color:#FFF;border:1px solid #CCC}      
        img{border:0;margin-top:2px;}      

 

（5）C#部分：

     upload.aspx   

    protected void Page_Load(object sender, EventArgs e)
    {
        n0.upload.Save();
        Response.Redirect("01.htm");
    }

     upload.cs

 

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

namespace n0
{

    /// <summary>
    /// upload 的摘要说明
    /// </summary>
    public class upload
    {
        public upload()
        {
            //
            // TODO: 在此处添加构造函数逻辑
            //
        }

        private static string _fileType = ".zip|.rar|.txt|.jpg|.gif";
        //private static string _uploadPath = "~/UploadFiles/";
        private static string _uploadPath = "~/2008/UploadFiles/";
        private static int _maxFilesQuantity = 10;

        public static string FileType
        {
            get { return _fileType; }
            set { _fileType = value; }
        }

        public static string UploadPath
        {
            get { return _uploadPath + DateTime.Now.ToString("yyyy_MM") + "/"; }
            set { _uploadPath = value; }
        }

        public static int MaxFilesQuantity
        {
            get { return _maxFilesQuantity; }
            set { _maxFilesQuantity = value; }
        }


        /// <summary>
        /// Upload
        /// </summary>
        /// <param name="grade">CategoryId</param>
        /// <param name="gradeid">ItemId</param>
        public static void Save()
        {
            HttpFileCollection files = HttpContext.Current.Request.Files;
            if (files.Count > 0 && files.Count <= _maxFilesQuantity)
            {
                for (int i = 0; i < files.Count; i++)
                {
                    HttpPostedFile file = files[i];
                    if (file.ContentLength > 0)
                    {
                        string fileName = GenerateFileName(System.IO.Path.GetFileName(file.FileName));
                        string uploadPath = UploadPath;
                        string filePath = HttpContext.Current.Server.MapPath(uploadPath);

                        if (CheckExtensionName(fileName))
                        {
                            if (!System.IO.Directory.Exists(filePath)) System.IO.Directory.CreateDirectory(filePath);
                            file.SaveAs(filePath + fileName);

                            // Save to DB
                            string id = files.AllKeys[i].Substring(5);
                            //AttachmentInfo item = new AttachmentInfo();
                            //item.Description = HttpContext.Current.Request.Form["filedesc_" + id].Trim();
                            //item.Url = uploadPath + fileName;
                            //item.Grade = grade;
                            //item.GradeID = gradeid;

                            //new AttachmentBLL().CreateAttachment(item);
                        }
                    }
                }
            }
        }

        /// <summary>
        /// Check the file\'s extension is valid or not.
        /// </summary>
        private static bool CheckExtensionName(string fileName)
        {
            if (FileType == ".*") return true;

            if (FileType.IndexOf(System.IO.Path.GetExtension(fileName)) == -1)
                return false;
            else
                return true;
        }

        /// <summary>
        /// Generate a new filename from the old filename.
        /// </summary>
        private static string GenerateFileName(string fileName)
        {
            System.Text.StringBuilder sb = new System.Text.StringBuilder();
            sb.Append(new Random().Next(100, 999).ToString());
            sb.Append("_");
            sb.Append(DateTime.Now.ToString("HHmmss"));
            sb.Append("_");
            sb.Append(fileName);

            return sb.ToString();
        }


    }
}

 

(6)附录：实现多文件上传，朋友们可以替换个HTML部分如下，也可以修改个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>无标题页</title>
   

</head>
<body>
<form id="form1"  enctype="multipart/form-data" method="post" action="upload.aspx">
    <table>
        <tr>
            <td>
                相关上传:<input id="Submit1" type="submit" value="submit" />
                </td>
            <td>
                <div style="display: none;" id="theFile">
                    <div>
                        附件:
                        <input type="file" name="file" />
                        描述:
                        <input type="text" name="file_desc" />
                        <a href="###">[删除]</a> <a href="javascript:attach_add();">[增加]</a>
                    </div>
                </div>
                <div id="myFile">
                </div>
            </td>
        </tr>
    </table>
    </form>
<script type="text/javascript">
        var aid = 1;
        function attach_add()
        {
             var newNode = document.getElementById(\'theFile\').firstChild.cloneNode(true);
             newNode.id = "file" + aid;
             newNode.childNodes[1].name = "file_" +aid;
             newNode.childNodes[3].name = "filedesc_" +aid;
             newNode.childNodes[5].href = "javascript:attach_sub(" +aid+ ")";
             document.getElementById(\'myFile\').appendChild(newNode);
             aid++;
        }
        attach_add();
        function attach_sub(id)
        {
             var theNode = document.getElementById(\'file\'+id);            
             document.getElementById(\'myFile\').removeChild(theNode);
        }
</script>
</body>
</html>

 

 

上一篇：7种HTML在线编辑器 下一篇：HTML编辑器基础:兼容各种浏览器
相关文章
推荐阅读
随机推荐
我们已经准备好了，你呢？
获取网站建设报价
2024我们与您携手共赢，为您的企业形象保驾护航！