Last Update:2017-08-24
Source: Internet
Author: User
Keywords
Web page production
Ajax
javascript
<!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= "HTML; charset=gb2312 "/> <title> webpage Special effects dynamic Increase Delete upload attachment code </title> </head>
<body>
JS implements the file field code for multiple upload attachments <style type= "Text/css Tutorial" >. file {font:10pt; color:black;} </style> < Script language= "Web effects" function AddFile () { var filediv = document.all[' Filediv ']; var strhtml = ' <span><input type= ' file ' > <button onclick= "RemoveFile (parentnode);" > Delete </button><br></span> '; filediv.innerhtml + = strhtml; } function removefile (obj) { Obj.removenode (TRUE); } </script> <form enctype= "Multipart/form-data" <div ID= "Filediv" ></div> <a href= javascript:void (AddFile ()); "Class=" File "> Add attachment </a> </form>//method Two like Hotmail mailbox add attachment mode dynamic increase upload attachment code
<div id= "Files" > <div> <input Type=button onclick= "Add ();" Value=attacthment>
<script> var html= "<input name=title type=file> <input type=button value=delete onclick=" Remove (This) ">"; function Add () { var o=document.all["files"]; var div=document.createelement ("div"); div.innerhtml=html; O.appendchild (DIV); Div.childnodes[0].click (); } function Remove (obj) { Obj.parentelement.parentelement.removechild (obj.parentelement); } </script> Method Three js dynamic increase delete upload attachment code
<style type= "Text/css" > file {font:10pt; color:black;} </style> <script language= "JavaScript" > var i=0; function AddFile () { i++;
Currrow=conditiontable.insertrow (); Cellc=currrow.insertcell (); cellccontext= ' <input type= "file" Name= "file+" +i> <button onclick= "RemoveFile ();" > Removal </button><br> '; Cellc.innerhtml=cellccontext;
} function Findtd (o) { if (o.nodename== "TR" | | o.nodename== "table") return; if (o.nodename== "TD") Return (o); Else return (o.parentelement); } function RemoveFile () { o = Findtd (event.srcelement); alert (o.parentelement.rowindex*1); Conditiontable.deleterow (o.parentelement.rowindex*1);
} function UploadFile () {
}
</script> <form enctype= "Multipart/form-data" > <a href= "Javascript:void (AddFile ());" class= "file" > Add attachment </a> <a href= "Javascript:void (UploadFile ());" class= "file" > Upload attachment </a> <div id= "Filediv" style= ' Height:150px;top:150px;left:0px;overflow-x:auto;overflow-y:auto; Border-width:1pt;border-color:black; ' > <table id=conditiontable border=1 > </table> </div>
</form> </body> </html>