仿网易126网络硬盘上传

<! 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=gb2312"   />
< title > 仿网易126网络硬盘上传 by littlelam </ title >
</ head >
< script >
// css样式以及部分代码源自126
var  TotalFiles  =   0 ;
function  AddFiles()
{
    TotalFiles 
++ ;
    
var  file = document.createElement( " input " ); 
    file.type 
=   " file " ;
    file.id 
=   " f " +  TotalFiles.toString();
    file.name 
=   " files " +  TotalFiles.toString(); 
    file.hideFocus 
=   true ;
    file.size 
=   1 ;
    file.style.cssText 
=   " cursor:pointer; width:1px; border:none; height:32px; padding:0px; margin:0px;position:absolute; opacity:0;filter:alpha(opacity=0);left:-32px !important;left:-5px;left/**/:-3px; font-size:20px; " ;
    file.onchange 
=   function  ()
    {
        
for  ( var  i = 1 ;i <= TotalFiles;i ++ )
        {
            
if  ($( " f " + i.toString()) && $( " f " + i.toString()) != this )
            {
                
if  ($( " f " + i.toString()).value  ==   this .value)
                {
                    DelFile(
this .id.replace( " f " , "" ));
                    AddFiles();
                    window.alert(
" 已有相同文件,无须重复上传 " );
                    
return ;
                }
                    
            }
                
        }
        $(
" s " + TotalFiles.toString()).innerHTML  =   " <table class=oplist_filelist cellSpacing=0 cellPadding=0 width="100%" border=0><tr class=tr_file><td class=td_pathlist>&nbsp; "   +  $( " f " + TotalFiles.toString()).value  +    " </td><td class=td_operate noWrap><span οnclick="DelFile(' " + TotalFiles.toString() + " ')" style="cursor:pointer;color:red;font-weight:bloder;">X&nbsp;移除</span></td></tr></table> " ;
        
this .style.display  =   " none " ;
        AddFiles();
        CheckUploadDiv();
    };
    $(
" uploadInput " ).appendChild(file);
    
var  div = document.createElement( " div " ); 
    div.id 
=   " s " +  TotalFiles.toString();
    $(
" uploadDiv " ).appendChild(div);

}
function  DelFile(str)
{
    $(
" uploadInput " ).removeChild($( " f " + str));
    $(
" uploadDiv " ).removeChild($( " s " + str));  
    CheckUploadDiv();
}
function  CheckUploadDiv()
{
    $(
" divNone " ).style.display  =  $( " uploadDiv " ).innerHTML.indexOf( " 移除 " ) ==- 1 ? "" : " none " ;
}
function  DelEmpty()
{
    
for  ( var  i = 1 ;i <= TotalFiles;i ++ )
    {
        
if  ($( " f " + i.toString()))
        {
            
if  ($( " f " + i.toString()).value  ==   "" )
                $(
" uploadInput " ).removeChild($( " f " + i.toString()));
        }
            
    }
}
function  checkForm()
{
    
var  HaveFile  =   false ;
    
for  ( var  i = 1 ;i <= TotalFiles;i ++ )
    {
        
if  ($( " f " + i.toString()))
        {
            
if  ($( " f " + i.toString()).value  !=   "" )
            {
                HaveFile 
=   true ;
                
break ;
            }
        }            
    }
    
if  ( ! HaveFile)
    {
        window.alert(
" 点击“添加文件”按钮 添加要上传的文件 " );    
        
return   false ;
    }    
    $(
" submitButton " ).disabled  =   true ;
    DelEmpty();
    
return   true ;
}
function  $(id)
{
    
return  document.getElementById(id);    
}
</ script >
< style >
a.btn
{ background-image : url(http://mimg.163.com/netfolder/images/all_toolbar.gif) ; display : block ;  background-position : 2px -32px ;  margin : 6px 4px ; float : left ;  border : 1px solid #bebebe ;  cursor : pointer ;  position : relative ; }
.addbtn
{ height : 32px ; width : 100px ; }
a.btn:hover
{ background-position : 2px -64px ;  border : 1px solid #d2d2d2 ;  background-color : #FFFFEE ; }
</ style >
< body >
< FORM  METHOD ="post"  NAME ="form1"  ACTION ="savetofile.aspx"  ENCTYPE ="multipart/form-data"  onSubmit ="return checkForm();" >
< table  width ="100%"  border ="0"  cellspacing ="0"  cellpadding ="0"  class ="twp_all" >
  
    
< tr >
      
< td >< div  class ="oplist_op_af_inner"  id ="buttonDiv" >< href ="javascript:AddFiles();"  class ="btn" >< div  id ="uploadInput"  class ="addbtn" ></ div ></ a >           
        
</ div >
        
</ td >
    
</ tr >
    
< tr >
      
< td >
        
< div  class ="twp_con_div2"  id ="filePanel" >
          
< table  width ="100%"  border ="0"  cellspacing ="0"  cellpadding ="0"  class ="oplist_filelist" >
            
< tr  class ="tbl_inner_title" >
              
< td  class ="td_pathlist" > 文件路径 </ td >
              
< td  nowrap class ="td_operate" > 操作 </ td >
            
</ tr >
          
</ table >           
          
< div  id ="uploadDiv" ></ div >
        
</ div >
       
</ td >
    
</ tr >
< script > AddFiles(); </ script >   
  
< tr >
    
< td  class ="wp_bottom button_bar" >< input  name ="submit"  id ="submitButton"  type ="submit"  value ="开始上传" >
      &#160;
     
</ td >
  
</ tr >
</ table >
</ form >
</ body >
</ html >

 
  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 打赏
    打赏
  • 扫一扫,分享海报

©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页

打赏作者

littlelam

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值