📄 5-36.html
字号:
<HTML>
<HEAD>
<TITLE> AJAX深入浅出--代码5-36</TITLE>
<META http-equiv="Content-Type" content="text/html;charset=GB2312"/>
</HEAD>
<BODY>
<TABLE>
<TR>
<td> 附件名称：</td>
<td id="uploadfile"> <P id="MyFile">
<input type="file" name ="filename1" id="filename1" size="60"><input type="button" onclick="addFileUpload()" value="添加"><INPUT TYPE="hidden" NAME="docType1" id="docType1" VALUE=""><INPUT TYPE="hidden" NAME="fname1" VALUE=""></P>
</td>
</TR>
</TABLE>
</BODY>
</HTML>
<script language="javascript">
//文件数量,默认是一个
var newFile=1;
//添加一个文件上传框
function addFileUpload() {
//计数加一
newFile++;
//生成一个字符串的html模板
var str = "<BR id='br"+newFile+"'><input type='file' id='filename"+newFile+"' name ='filename"+newFile+"' size='60'><INPUT TYPE='hidden' NAME='docType"+newFile+"' id='docType"+newFile+"' VALUE=''><INPUT TYPE='hidden' id='fname"+newFile+"' NAME='fname"+newFile+"' VALUE=''><input type='button' value='删除' id='btn"+newFile+"'>"
//将该字行串模板做为html对象添加进去
document.getElementById('MyFile').insertAdjacentHTML("beforeEnd",str);
//获得删除按钮对象的句柄
var obj = document.getElementById("btn"+newFile);
//动态绑定onclick事件，其响应函数为delFileUpload
obj.attachEvent("onclick",new Function("delFileUpload("+newFile+")"));
obj.attachEvent("onclick",confirmDel);
}
//删除一个文件上传框
function delFileUpload(index) {
//分别找到当前删除文件上传的一些对象,并删除它
var obj = document.getElementById("br"+index);
document.getElementById('MyFile').removeChild(obj);
var obj = document.getElementById("filename"+index);
document.getElementById('MyFile').removeChild(obj);
var obj = document.getElementById("docType"+index);
document.getElementById('MyFile').removeChild(obj);
var obj = document.getElementById("fname"+index);
document.getElementById('MyFile').removeChild(obj);
var obj = document.getElementById("btn"+index);
document.getElementById('MyFile').removeChild(obj);
}
function confirmDel() {
alert("注意，此时还没有删除");
}
</script>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -