它可以实现纯粹html、javascrip难以逾越的功悄基兄能:
(1)可以同时上传多个文件;
(2)类似AJAX的无刷新上传;
(3)可以锋神显示上传进度;
(4)良启袭好的浏览器兼容性;
具体详见百度百科:
http://baike.baidu.com/view/1332553.htm
有详细的注释,不清楚直接CALL我主要是利用了JS来控制文件域,增加或者删除来实现的。
<!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/htmlcharset=gbk" />
<meta name="Keywords" content=""/>
<meta name="Description" content=""/>
<title>动态添加图片</title>
<script type="text/javascript">
function addimg(){
//包含所有文件州枣域的DIV
var div = document.getElementById('imgs')
//文件域
var input = document.createElement("input")
input.name = "img[]"
input.type = 'file'
//添加
div.appendChild(input)
//删除按钮
var button = document.createElement("a")
button.href = "javascript:"
button.innerHTML = '删除'
div.appendChild(button)
//换行
var br = document.createElement("br")
div.appendChild(br)
//在按钮上增加删除的事件
button.onclick = function(){
input.parentNode.removeChild(input)
this.parentNode.removeChild(this)
br.parentNode.removeChild(br)
}
}
</script>
</head>
<body>
<form method="POST" enctype="multipart/form-data" action="upload.php">
请选择图片:
<div id="imgs">
<input type="file" name="img[]"/><br/>
</div>
<input type="button" onclick="addimg()" value="增加"/>
</form>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)